Comparison
design.md is documentation.
LESS tokens are infrastructure.
In March 2026, Google launched design.md as part of Stitch: a portable markdown file that describes design systems for AI agents. It's a smart idea. But documentation and infrastructure are different things. Here's what separates a file you paste from contracts your agents resolve against.
What is design.md?
design.md is Google Stitch's portable design system format: a static markdown file with five sections. Visual Theme & Atmosphere, Color Palette & Roles, Typography Rules, Component Stylings, and Layout Principles.
It uses natural-language descriptions with hex values in parentheses, things like "Ocean-deep Cerulean (#0077B6)", to communicate design intent to AI agents. The file is generated through a 5-step pipeline: retrieval, extraction, translation, synthesis, and alignment. You copy it into your prompt context, and the agent uses it as a reference when generating UI.
It's a genuine step forward for design portability. But it's still a document. Not a contract. Not an API. Not infrastructure.
Technical comparison
Format
Static markdown file
Runtime API + enforceable contracts
Generation
5-step pipeline (retrieval → extraction → translation → synthesis → alignment) via design-md skill
Single API call
Source
Extracted from existing screens after the fact
Generated from brand description before any screen exists
Portability
Copy-paste markdown into prompts
API-served at runtime to any agent
Determinism
Non-deterministic (natural language descriptions)
Deterministic (machine-enforceable rules)
Enforcement
No enforcement (descriptive documentation)
Agentic guardrails validate against contracts
Resolution
One-way (extract → document)
Bidirectional (brand ↔ agent ↔ code)
Scope
Colors, typography, spacing, components, layout
Full expression system including voice, behavior, patterns
The architectural difference
design.md
Documentation You Paste
A markdown file you copy into prompts. Natural language descriptions of colors, typography, and layout. Extracted from existing designs after the fact. The agent reads it as context. No validation, no enforcement, no runtime access.
LESS Tokens
Infrastructure You Resolve Against
Enforceable contracts served via API at runtime. Deterministic resolution rules that agents validate against. Generated from a brand description before any screen exists. Same input, same output, every time.
The difference is architectural. design.md is a file that lives in your clipboard. LESS tokens are a service that lives in your infrastructure. One is read by agents as a suggestion. The other is resolved against as a contract.
design.md describes what a design system looks like. LESS tokens define what a design system enforces. When an agent generates UI against a design.md, there's no mechanism to check whether the output actually follows the spec. When an agent resolves against LESS tokens, agentic guardrails validate every decision.
When to use which
Documenting existing designs
Use design.md, great for capturing and sharing what already exists.
Building production systems
Use LESS tokens: deterministic contracts your agents resolve against at runtime.
Sharing design context with humans
Use design.md, readable markdown that any designer or developer can review.
Serving design contracts to AI agents at runtime
Use LESS tokens: API-served infrastructure with agentic guardrails.
Quick prototyping in Stitch
Use design.md, native to the Stitch canvas workflow.
Enterprise brand governance
Use LESS tokens: Brand OS with enforceable contracts and compliance.
Ready for design contracts?
Documentation is where design systems start. Infrastructure is where they ship. Describe your brand once and get enforceable contracts that every AI agent resolves against.
Get Started
Learn more about LESS Studio
Go deeper
Frequently asked questions
What is design.md?
design.md is Google Stitch's portable design system format: a static markdown file with five sections. Visual Theme & Atmosphere, Color Palette & Roles, Typography Rules, Component Stylings, and Layout Principles. It uses natural-language descriptions with hex values in parentheses to describe a design system that AI agents can reference when generating UI.
What are LESS tokens?
LESS tokens are enforceable design contracts generated by LESS Studio. Unlike static documentation, LESS tokens are served via runtime API to any AI agent, with deterministic resolution rules and agentic guardrails that validate agent output against brand contracts. They cover the full expression system: colors, typography, spacing, components, voice, behavior, and patterns.
Can I use design.md with Claude Code?
Yes, you can copy-paste a design.md file into Claude Code's context window. However, this is static documentation that consumes context tokens and has no enforcement mechanism. LESS tokens integrate via MCP server, giving Claude Code live runtime access to enforceable design contracts without copy-paste or context window overhead.
What is the difference between design.md and LESS tokens?
design.md is documentation: a static markdown file you copy into prompts with natural-language descriptions of design intent. LESS tokens are infrastructure — enforceable contracts served via API at runtime with deterministic resolution, agentic guardrails, and bidirectional brand-agent-code resolution. design.md describes. LESS tokens enforce.
Is design.md or LESS better for AI agents?
For quick prototyping inside Google Stitch, design.md works well. For production systems where AI agents need reliable, enforceable design contracts at runtime, LESS tokens are the infrastructure-grade solution. LESS tokens are deterministic, API-served, and validated by agentic guardrails. design.md is a markdown file with no enforcement.