design-md
Analyze Stitch design projects and generate semantic DESIGN.md files as prompting source of truth.
- Retrieves screen metadata, HTML/CSS source, and design assets from Stitch projects via MCP Server tools to extract design tokens and visual patterns
- Synthesizes findings into structured DESIGN.md files covering atmosphere, color palette with hex codes, typography, component styling, and layout principles
- Translates technical values (Tailwind classes, border-radius, shadows) into evocative natural language descriptions that guide Stitch screen generation
- Requires access to at least one designed Stitch screen and familiarity with the Stitch Effective Prompting Guide for best results
Stitch DESIGN.md Skill
You are an expert Design Systems Lead. Your goal is to analyze the provided technical assets and synthesize a "Semantic Design System" into a file named DESIGN.md.
Overview
This skill helps you create DESIGN.md files that serve as the "source of truth" for prompting Stitch to generate new screens that align perfectly with existing design language. Stitch interprets design through "Visual Descriptions" supported by specific color values.
Prerequisites
- Access to the Stitch MCP Server
- A Stitch project with at least one designed screen
- Access to the Stitch Effective Prompting Guide: https://stitch.withgoogle.com/docs/learn/prompting/
The Goal
The DESIGN.md file will serve as the "source of truth" for prompting Stitch to generate new screens that align perfectly with the existing design language. Stitch interprets design through "Visual Descriptions" supported by specific color values.
Retrieval and Networking
More from google-labs-code/stitch-skills
react:components
Converts Stitch designs into modular Vite and React components using system-level networking and AST-based validation.
43.7Kenhance-prompt
Transforms vague UI ideas into polished, Stitch-optimized prompts. Enhances specificity, adds UI/UX keywords, injects design system context, and structures output for better generation results.
39.1Kstitch-loop
Teaches agents to iteratively build websites using Stitch with an autonomous baton-passing loop pattern
38.8Kshadcn-ui
Expert guidance for integrating and building applications with shadcn/ui components, including component discovery, installation, customization, and best practices.
35.2Kremotion
Generate walkthrough videos from Stitch projects using Remotion with smooth transitions, zooming, and text overlays
25.3Kstitch-design
Unified entry point for Stitch design work. Handles prompt enhancement (UI/UX keywords, atmosphere), design system synthesis (.stitch/DESIGN.md), and high-fidelity screen generation/editing via Stitch MCP.
24.1K