ad-design

You can generate a DESIGN.md file by scanning existing design tokens from Figma exports, tokens.json, Tailwind themes, or CSS variables, and synthesizing them into W3C-compatible YAML frontmatter alongside a Markdown rationale.

The Google Labs design.md spec requires a DESIGN.md file at the repo root containing machine-readable YAML frontmatter with $value/$type tokens and a narrative Markdown rationale detailing the visual contract.

Yes, you can audit an existing DESIGN.md to surface drift by comparing its YAML frontmatter tokens against the current source tokens from Figma exports, Tailwind configuration, or CSS variables.

Yes, it works with Figma exports, Tailwind configuration, tokens.json, and CSS variables by extracting token groups like colors, typography, spacing, and motion to produce a cohesive design contract.

The best way to structure design tokens is by synthesizing them into W3C-compatible YAML frontmatter within a root DESIGN.md file, grouping colors, typography, spacing, and motion into a machine-readable visual contract.

Your DESIGN.md needs narrative rationale because the YAML frontmatter provides machine-readable $value/$type tokens for automation, while the Markdown rationale serves as a human-readable visual contract for the design system.