skills.rest
eastreams
eastreamsOFFICIAL
Explore all skills by this author →
WebsiteGitHub

design-md

Generate a semantic DESIGN.md file from Stitch project design assets.

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

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Designers using Stitch must manually translate screen code and visual assets into DESIGN.md documentation, a time‑consuming process that hinders efficient prompt generation and consistency across projects.

Core Features & Use Cases

  • Automated Retrieval: Connects to the Stitch MCP Server to gather project metadata, screen code, and screenshots.
  • Semantic Synthesis: Extracts colors, typography, component patterns, and layout principles, translating technical values into natural‑language design descriptions.
  • Standardized Output: Produces a well‑structured DESIGN.md file that serves as the single source of truth for AI‑driven screen generation.
  • Use Case: Quickly create a DESIGN.md for a Furniture Collection project's Home screen, enabling consistent Stitch prompts for new screen concepts.

Quick Start

Ask the design‑md skill to analyze the Home screen of my Stitch project and create 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 DESIGN.md file from Stitch project assets?▼

Generating a DESIGN.md file from Stitch assets requires connecting to the Stitch MCP Server to fetch screens and HTML code, then synthesizing colors, typography, and component specifications into structured markdown documentation.

What is semantic design system documentation for AI screen generation?▼

Semantic design system documentation translates technical visual values from screen code into natural-language descriptions, serving as a single source of truth to provide consistent context for AI-driven screen generation prompts.

Do I need the Stitch MCP Server to extract typography and color specifications?▼

Yes, you need the Stitch MCP Server connected to your environment to retrieve project metadata, screen code, and screenshots required to extract and synthesize typography and color specifications into markdown.

How to automate Stitch design documentation instead of manually translating screen code?▼

Automate Stitch design documentation by retrieving project metadata and screenshots via the Stitch MCP Server, then synthesizing technical HTML code and visual values into a standardized markdown file without manual translation.

What's the best way to create consistent Stitch prompts for new screen concepts?▼

The best way to create consistent Stitch prompts is to establish a standardized DESIGN.md file that defines layout principles and component patterns, acting as a single source of truth for all new AI-driven screen generation.

Related Skills

Explore More Design & Creative Skills→
Chris-MaskeyChris-Maskey

design-md

Analyze Stitch project screens and synthesize a semantic DESIGN.md file.

Community
Advanced
RenyEnnosRenyEnnos
1

design-md

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

Community
Advanced
frankxaifrankxai
6

design-system-architecture

Implement token hierarchies with semantic, alias tokens for scalable design systems.

Community
Advanced
vhoangbkvhoangbk

design-md

Analyze Stitch projects and generate DESIGN.md files with semantic design tokens.

Community
Intermediate