design-md

Analyze Stitch project metadata and synthesize a semantic DESIGN.md.

1|Updated Mar 24, 2026
One-click install
npx skills add https://github.com/rovanni/IalClaw --skill design-md-rovanni
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design-md
Source: https://github.com/rovanni/IalClaw/tree/main/skills/internal/design-md
Command: npx skills add https://github.com/rovanni/IalClaw --skill design-md-rovanni

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Stitch projects often lack a cohesive, machine-readable design language. This skill analyzes a Stitch project and synthesizes a semantic DESIGN.md that codifies atmosphere, color tokens, typography, and component patterns to serve as the source of truth for design prompts.

Core Features & Use Cases

  • Retrieval and analysis of Stitch project metadata (screens, colors, tokens) to inform a DESIGN.md.
  • Translation of technical design tokens into natural, designer-friendly language and a structured DESIGN.md.
  • End-to-end synthesis of a DESIGN.md that aligns new screens with existing design language and Stitch guidelines.
  • Use Case: A design team wants a ready-to-prompt DESIGN.md to anchor future screen generation.

Quick Start

Analyze a Stitch project by providing its project reference to generate a DESIGN.md that mirrors the project's design language.

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 a Stitch project?▼

To generate a design system document from a Stitch project, you analyze screen metadata and color tokens to synthesize a semantic DESIGN.md. This document serves as the design language source of truth, codifying atmosphere, typography, and component patterns.

What is a semantic DESIGN.md and how does it codify design tokens?▼

A semantic DESIGN.md translates technical color and typography tokens into natural, designer-friendly language to codify atmosphere, components, and layout. It serves as a structured source of truth to anchor future design prompts and align new screens.

Does generating a DESIGN.md require Stitch MCP data and HTML metadata?▼

Yes, generating a DESIGN.md requires access to Stitch MCP data, HTML/CSS metadata, and a project design theme. These inputs are necessary to map design tokens accurately and produce the final semantic design language source of truth.

How do I translate Stitch color tokens into a design language source of truth?▼

You translate Stitch color tokens into a design language source of truth by retrieving project metadata and mapping tokens within a structured DESIGN.md. This synthesis process aligns technical color values with semantic atmosphere and component patterns.

Can I use a generated DESIGN.md to align new screens with existing Stitch guidelines?▼

Yes, you can use a generated DESIGN.md to align new screens with existing Stitch guidelines and design language. It acts as a ready-to-prompt anchor ensuring future screen generation matches codified atmosphere, color, and typography rules.

What are the limitations of synthesizing design docs from Stitch projects?▼

The limitation of synthesizing design docs from Stitch projects is that the output relies entirely on available Stitch MCP data, HTML/CSS metadata, and existing color tokens. Without these specific project inputs, the semantic DESIGN.md cannot accurately map the design language.