design.md (Google Labs)

Source: https://stitch.withgoogle.com/docs/design-md/specification Repo: https://github.com/google-labs-code/design.md Fetched: 2026-05-17 Status: alpha

Purpose

DESIGN.md is a format specification for visual identity / design systems intended to be consumed by coding agents. It “gives agents a persistent, structured understanding of a design system” by combining machine-readable tokens with human-readable rationale.

Originates from Stitch (Google Labs’ “design with AI” product). Distributed under google-labs-code/design.md on GitHub.

File structure

Two layers in a single Markdown file:

YAML front matter (delimited by ---) — design tokens (colors, typography, spacing, components) with exact machine-readable values.
Markdown body — ##-headed sections explaining design philosophy and application guidance.

Token categories

Colors — hex sRGB, e.g. "#1A1C1E".
Typography — objects with fontFamily, fontSize, fontWeight, lineHeight, letterSpacing, font features.
Dimensions — numbers with units (px, em, rem).
Token references — {path.to.token} syntax for cross-referencing.
Components — named UI elements mapping backgroundColor, textColor, rounded, padding, size, etc.

Canonical section order

When present, sections must appear in this order:

Overview
Colors
Typography
Layout
Elevation & Depth
Shapes
Components
Do’s and Don’ts

Tooling

A CLI lint tool ships with the spec. Seven checks:

Broken token references
Missing primary colors
Contrast ratio compliance (WCAG AA)
Orphaned tokens
Token summaries
Missing required sections
Section order validation

Interoperability

Tokens export to:

Tailwind v3 / v4
W3C Design Token Format (DTCG)

Governance

Owned by Google Labs (Stitch team).
Repository: github.com/google-labs-code/design.md
Version: alpha as of 2026-05-17.