design-md

Name: design-md
Availability: InStock
Author: huangzida

Generate a DESIGN.md semantic design document from Stitch project data.

2|1|Updated Mar 26, 2026

Search Tags:#tokens #design-system #ui-patterns #stitch #design-synthesis #design-analysis

Ready to run

npx skills add https://github.com/huangzida/skills --skill design-md-huangzida

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: design-md
Source: https://github.com/huangzida/skills/tree/main/design-md
Command: npx skills add https://github.com/huangzida/skills --skill design-md-huangzida

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Synthesizes a DESIGN.md semantic design document from Stitch project data, enabling consistent, prompt-ready design documentation.

Core Features & Use Cases

Auto-generation: Converts HTML/CSS, color themes, typography, and design tokens into a human-readable DESIGN.md.
Design-token Translation: Extracts tokens and describes them in natural language for design guidance.
Use Case: Given a Stitch project, produce a DESIGN.md that serves as the single source of truth for prompting screen generation.

Quick Start

Generate a DESIGN.md for a Stitch project by providing the project metadata and screen assets to Stitch and requesting a semantic design document.

Frequently Asked Questions about design-md

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I generate a design system document from Stitch project data?▼

To generate a design system document from Stitch project data, provide the project metadata and screen assets to extract colors, typography, spacing, tokens, and layout patterns, translating them into a human-readable DESIGN.md file.

Can I extract design tokens from HTML and CSS for semantic documentation?▼

Yes, design tokens are extracted directly from HTML and CSS and translated into natural language, providing descriptive design guidance within the generated DESIGN.md semantic document.

What is the best way to document UI patterns across multiple screens for prompting?▼

The best way to document UI patterns across multiple screens for prompting is synthesizing a DESIGN.md file that serves as the single source of truth, ensuring consistent design system documentation across teams.

Does Stitch design synthesis work with projects containing only color themes and typography?▼

Stitch design synthesis works with projects containing color themes and typography, but it is fully applicable to Stitch projects with multiple screens and design tokens for comprehensive design analysis.

How do I translate design tokens into natural language for design guidance?▼

Design tokens are translated into natural language by extracting semantic values from HTML/CSS and project metadata, then describing them in a human-readable format within the DESIGN.md document.

Why do I need a semantic design document for screen generation?▼

A semantic design document is needed for screen generation because it acts as a prompt-ready single source of truth, enabling consistent application of colors, typography, and layout patterns across teams.