skills.rest
caobingsheng
caobingshengCOMMUNITY
Explore all skills by this author →
GitHub

design-md

Analyze Stitch projects to generate DESIGN.md files documenting design systems.

1|Updated Mar 26, 2026
Search Tags:#design-system#stitch#design-documentation#design-analysis#design-md#semantic-design
One-click install
npx skills add https://github.com/caobingsheng/skills --skill design-md-caobingsheng
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design-md
Source: https://github.com/caobingsheng/skills/tree/main/design/design-md
Command: npx skills add https://github.com/caobingsheng/skills --skill design-md-caobingsheng

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill helps teams convert Stitch project assets and metadata into a cohesive semantic design system by producing a DESIGN.md that documents the design language and guidelines, enabling consistent UI generation.

Core Features & Use Cases

  • Analyze Stitch projects to extract design language, color tokens, typography rules, component patterns, and layout principles.
  • Synthesize a DESIGN.md file that serves as the "source of truth" for prompting Stitch to generate screens aligned with existing design language.
  • Use for onboarding new projects, maintaining design consistency across teams, and accelerating design-to-development handoffs.

Quick Start

Analyze a Stitch project and generate a DESIGN.md that captures the semantic design system.

Frequently Asked Questions about design-md

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

FAQPage Schema
How do I generate design documentation for a Stitch project?▼

To generate design documentation for a Stitch project, analyze existing design language and assets to synthesize a structured DESIGN.md file containing color tokens, typography rules, component styles, and layout principles.

What is a semantic design system and how is it documented?▼

A semantic design system defines UI elements by meaning rather than raw values. It is documented by analyzing Stitch projects and synthesizing a DESIGN.md file that captures atmosphere, color tokens, typography, and layout rules.

How do I maintain design consistency across teams using Stitch?▼

Maintain design consistency across teams by generating a DESIGN.md file from Stitch projects. This document serves as the source of truth for prompting Stitch to generate new screens aligned with existing design guidelines.

Do I need a Stitch MCP Server to extract color tokens and typography rules?▼

Yes, extracting color tokens and typography rules requires access to Stitch MCP Server metadata, assets, and design guidelines to successfully analyze the project and synthesize the semantic design system.

Can I use an existing design language to generate a DESIGN.md for new screens?▼

Yes, you can apply an existing design language from Stitch projects to generate a DESIGN.md. This file documents component patterns and layout principles specifically for generating new, consistent screens.

Related Skills

Explore More Design & Creative Skills→
npc-chrisnpc-chris
1

design-md

Analyze Stitch project screens and metadata to generate a semantic DESIGN.md file.

Community
Advanced
JStaRFilmsJStaRFilms
23

design-md

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

Community
Intermediate
lintendolintendo
152

design-md

Analyze Stitch projects to generate DESIGN.md with visual language tokens.

Community
Advanced
dabowmandabowman

figma-guidelines

Guide Figma design principles, component architecture, auto layout, and collaboration tools.

Community
Advanced