Google Stitch and DESIGN.md: The Workflow Most Designers Are Missing

When Google launched Stitch in March 2026, the headline was "vibe design" — a canvas where you describe an interface in plain language and watch it materialize in front of you. The tool is genuinely impressive. But buried inside the announcement was something more significant for anyone who builds products seriously: Stitch exports a DESIGN.md file.

That file is the actual output that matters.

HTML and CSS can be rewritten. Components get refactored. But a DESIGN.md file — a structured, machine-readable record of your design system's colors, typography, component rules, and brand principles — travels with your project wherever it goes. It's the source of truth that makes every subsequent AI-generated screen consistent with the first one.

The catch is that Stitch only generates a DESIGN.md from what it knows: your prompts, your uploaded images, and its own inferences. If you're building something new from scratch, that's fine. If you're working within an established visual language — an existing brand, a proven design system, a style guide with real constraints — you'll get better results faster by starting with a pre-built DESIGN.md than by coaxing Stitch to reconstruct it from scratch.

What DESIGN.md actually is

Google introduced DESIGN.md as an open specification — not a proprietary Stitch format, but a shared standard that any AI tool can read. The format uses Markdown for human readability and structured sections for machine precision. A complete DESIGN.md covers:

• Color palette with named semantic roles and exact hex values
• Typography — font families, scale, weights, and spacing
• Component specifications — buttons, cards, inputs, and navigation with exact values
• Spacing and radius systems — the grid and rounding rules that give a UI its character
• Elevation and shadow — how depth is expressed across surfaces
• Do's and Don'ts — explicit rules that prevent design drift across AI generations
• Agent Prompt Guide — pre-written prompts for common components

That last section is where the format becomes genuinely useful for AI workflows. Instead of hoping a language model correctly infers your design intent, you give it the exact prompt it should use — complete with hex codes, font weights, and border radii — to generate a correct component every time.

The standard Stitch workflow

Most designers using Stitch today follow a pattern that goes roughly like this:

1. Describe the interface in a prompt
2. Iterate on the generated layout
3. Export HTML/CSS or copy to Figma
4. Repeat for the next screen

This works. But each new session starts cold. Stitch doesn't carry forward the visual decisions from your last session unless you explicitly feed it that context again. The result is the same problem that plagues all AI-generated UI: consistency across screens is entirely dependent on how well you can re-describe your own design language in each new prompt.

A DESIGN.md file solves this by externalizing that description into a reusable document.

The better workflow: start with an existing DESIGN.md

Here's the workflow that most designers using Stitch aren't doing yet:

Step 1 — Start with a pre-built DESIGN.md

Rather than letting Stitch generate a design system from scratch, start with a DESIGN.md file from an established design system that matches the visual direction you're after. Design.md Store has a library of files extracted from real production systems — Stripe's minimal precision, Apple's typographic restraint, Coinbase's trust-forward palette, Starbucks' warm greens.

Pick the one closest to your target aesthetic. You'll adapt it — but the structure, the semantic token names, and the component specs are already worked out.

Step 2 — Upload the DESIGN.md as context in Stitch

Stitch accepts design system documents as session context. Attach your chosen DESIGN.md before writing your first prompt. Stitch will treat it as the visual source of truth for the session — colors, typography, component rules, all of it.

This means your first-generation output isn't a Stitch default; it's already anchored to a real design language.

Step 3 — Reference specific sections in your prompts

Generic prompts produce generic results even with a DESIGN.md attached. Make the reference explicit:

"Using the Button specs from Section 4 of the attached DESIGN.md, design a checkout confirmation screen with a primary CTA and a secondary cancel action."

"Apply the Color Palette and Typography scale from the DESIGN.md to a mobile navigation header."

The Agent Prompt Guide section — which appears at the bottom of every Design.md Store file — gives you copy-paste starters for the most common components. Use them directly. They're written to produce correct output from tools like Stitch, Claude Design, and v0.

Step 4 — Export and keep the DESIGN.md

When your Stitch session is done, the DESIGN.md — whether you brought it in or Stitch generated one — is the artifact worth keeping. It's what makes the next session consistent with this one. It's what your developers can reference when they're building components by hand. It's what you attach to Claude, Cursor, or v0 for any AI-assisted work that follows.

Code gets refactored. Design systems, when they're well-defined, don't.

Why this matters beyond Stitch

The significance of Google releasing DESIGN.md as an open format is that it establishes a common interface between design tools and AI coding assistants. Stitch exports it. Claude Design reads it. Cursor uses it as project context. v0 accepts it as a system prompt attachment.

A single, well-maintained DESIGN.md file becomes the connective tissue between every AI tool in your workflow.

This is new. Eighteen months ago, a design system lived in Figma, and "exporting" it for AI use meant writing a custom prompt from scratch each time. Now there's a shared format. The question isn't whether to use it — it's whether you're going to write your own from scratch or start with one that's already been validated against a real production system.

Getting started

Browse the pack directory to find a DESIGN.md file that matches your visual direction. Each file in the library is structured to the open DESIGN.md specification — ready to upload directly into Stitch, Claude Design, v0, or any AI tool that accepts document context.

If you're building something new, start with the design system closest to your target aesthetic and adapt the values. If you're working on an existing product, use a pack as a structural template for documenting your own system in the same format.

The Stitch workflow is a good one. A pre-built DESIGN.md makes it a great one.