design-md

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

Updated Aug 27, 2026
One-click install
npx skills add https://github.com/MediaAskeyDOJO/sakuteki-site --skill design-md-mediaaskeydojo
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design-md
Source: https://github.com/MediaAskeyDOJO/sakuteki-site/tree/main/.skills/source/design-md
Command: npx skills add https://github.com/MediaAskeyDOJO/sakuteki-site --skill design-md-mediaaskeydojo

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill automates the process of analyzing Stitch projects and synthesizing their design language into a structured DESIGN.md file, serving as a single source of truth for design consistency.

Core Features & Use Cases

  • Semantic Design System Synthesis: Analyzes Stitch project assets (screenshots, HTML, project metadata) to extract and define design elements.
  • DESIGN.md Generation: Creates a Markdown file detailing the project's visual theme, color palette, typography, component stylings, and layout principles.
  • Use Case: A designer needs to create a new screen for a Stitch project but wants to ensure it perfectly matches the existing design. They use this Skill to generate a DESIGN.md file that outlines the project's established design system, which can then be used as a reference for prompting AI to generate the new screen.

Quick Start

Use the design-md skill to analyze the Stitch project and generate 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 extract a design system from a Stitch project?▼

To extract a design system from a Stitch project, you analyze project assets like screenshots and HTML to synthesize the visual theme, color palette, typography, and layout principles into a structured DESIGN.md file.

What is a DESIGN.md file used for in visual design?▼

A DESIGN.md file serves as a single source of truth for design consistency, documenting a project's visual theme, color palette, typography, component stylings, and layout principles for future reference.

How do I document component stylings and typography for my design system?▼

You document component stylings and typography by analyzing your project's visual assets and metadata, then synthesizing these extracted design elements into a comprehensive Markdown file.

Do I need a Stitch MCP Server to generate design documentation?▼

Yes, you need access to Stitch MCP Server tools for data retrieval and web fetching capabilities to download assets required for analyzing the project and generating design documentation.

Can I use a generated design system to create new screens with AI?▼

Yes, you can use the generated DESIGN.md file outlining your established design system as a reference prompt for AI, ensuring newly generated screens perfectly match the existing visual design.

What's the best way to ensure design consistency across new UI screens?▼

The best way to ensure design consistency is to synthesize your existing project assets into a detailed DESIGN.md file, establishing a single source of truth for your semantic design system.