skills.rest
valuedriven
valuedrivenCOMMUNITY
Explore all skills by this author →
GitHub

design-md

Extract design tokens from Stitch projects and generate a semantic DESIGN.md.

4|3|Updated Feb 14, 2026
Search Tags:#design#design-system#design-token#stitch#design-synthesis#design-md#ux-doc
One-click install
npx skills add https://github.com/valuedriven/devai --skill design-md-valuedriven
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design-md
Source: https://github.com/valuedriven/devai/tree/main/.agents/skills/design-md
Command: npx skills add https://github.com/valuedriven/devai --skill design-md-valuedriven

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Synthesizes a semantic DESIGN.md document from Stitch project assets to serve as the centralized design language for prompting screen generation.

Core Features & Use Cases

  • Extracts color palettes, typography, spacing, and component patterns from Stitch projects.
  • Translates technical CSS/Tailwind values into natural language design tokens and descriptive guidelines.
  • Generates a complete DESIGN.md that acts as the single source of truth for consistent screen generation.

Quick Start

Analyze a Stitch project and run the skill to produce a DESIGN.md that codifies the 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 a design system document from a Stitch project?▼

You can generate a semantic DESIGN.md from Stitch projects by applying this skill to extract color, typography, spacing, and component patterns, mapping them to descriptive natural language design tokens.

What is a semantic DESIGN.md used for in screen generation?▼

A semantic DESIGN.md serves as the centralized design language and single source of truth for prompting consistent future screen generation. It translates technical CSS values into human-readable design guidelines.

Can I extract design tokens from Tailwind CSS values in my Stitch project?▼

Yes, the skill translates technical CSS and Tailwind values from Stitch projects into natural language design tokens and descriptive guidelines for your design system.

Does this approach work for projects without tokenized design languages?▼

This approach is specifically built for Stitch projects where screens are driven by tokenized design languages. Projects lacking tokenized values may not produce a complete semantic design narrative.

What is the best way to maintain consistency across generated UI screens?▼

The best way to maintain consistency is to codify your design system into a DESIGN.md document. This output acts as a single source of truth for future screen generation and component patterns.

Related Skills

Explore More Design & Creative Skills→
braswelljrbraswelljr
8

design-md

Generate DESIGN.md documentation from Stitch project design assets.

Community
Intermediate
LeonxlnxLeonxlnx
74.5k

stitch-design-taste

Generate tokenized DESIGN.md files with hex codes, font stacks, and motion parameters for Stitch.

Community
Advanced
Higashi-KotaHigashi-Kota

ui-component

Build accessible React UI components with design tokens and ARIA patterns.

Community
Advanced
gouravsingh311gouravsingh311

design-md

Analyze Stitch project assets and codify design tokens into DESIGN.md files.

Community
Intermediate