skills.rest
phuchau26
phuchau26COMMUNITY
Explore all skills by this author →
GitHub

design-md

Synthesize Stitch project assets into a semantic DESIGN.md file.

Updated Aug 27, 2026
Search Tags:#typography#tokens#design-system#color-palette#stitch#design-analysis#semantic-design
One-click install
npx skills add https://github.com/phuchau26/giatsay --skill design-md-phuchau26
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design-md
Source: https://github.com/phuchau26/giatsay/tree/main/skills/design-md
Command: npx skills add https://github.com/phuchau26/giatsay --skill design-md-phuchau26

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Stitch-based projects often lack a consistent, machine-actionable DESIGN.md that captures the design system tokens and guidelines. This skill automates the extraction and synthesis of a semantic design system from Stitch project assets into DESIGN.md to enable rapid, consistent screen generation.

Core Features & Use Cases

  • Analyze a Stitch project to extract color tokens, typography rules, spacing scales, component patterns, and design guidelines.
  • Generate a comprehensive DESIGN.md that serves as the single source of truth for prompting Stitch to create new screens aligned with the existing language.
  • Use cases include onboarding new design teams, regenerating design language after UI changes, and documenting legacy projects in a semantic format.

Quick Start

Provide the Stitch project metadata and assets to the Stitch MCP Server, then instruct the agent to synthesize a DESIGN.md file.

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 semantic design system from Stitch project assets?▼

A semantic design system captures color tokens, typography rules, spacing scales, and component guidelines into a machine-actionable format. It serves as a single source of truth for prompting Stitch to generate new screens with consistent design language.

How do I document color tokens and typography rules for an existing Stitch project?▼

You need access to the Stitch MCP Server, HTML/CSS assets, and token extraction logic. The project must contain Stitch screen metadata and design assets to properly synthesize the semantic design language into a DESIGN.md file.

Can I use this design system extraction for onboarding new design teams?▼

A semantic DESIGN.md provides a single source of truth that enables rapid, consistent screen generation aligned with an existing design language. It is more actionable than manual documentation because it captures machine-readable tokens and guidelines.

Why do I need a DESIGN.md file for my Stitch design system?▼

The DESIGN.md generation requires the Stitch MCP Server, screen metadata, HTML/CSS assets, and token extraction logic. It cannot synthesize a design system without these project assets and extraction dependencies.

Related Skills

Explore More Design & Creative Skills→
Nexprove-TeamNexprove-Team
1

design-md

Generate a DESIGN.md synthesizing semantic design tokens from Stitch projects.

Official
Advanced
google-labs-codegoogle-labs-code
8.0k

design-md

Analyze Stitch project assets to generate a DESIGN.md design system document.

Official
Advanced
RenyEnnosRenyEnnos
1

design-md

Generate DESIGN.md design-system documentation from Stitch project assets.

Community
Advanced
santosomarsantosomar
1

test-guided-migration-assistant

Guide code migration using existing test suites as behavioral oracles.

Community
Advanced