Google Labsは2026年4月21日、AIデザインツールStitchで用いるDESIGN.mdのドラフト仕様をオープンソースとして公開した。

• Stitch’s DESIGN.md format is now open-source so you can use it across platforms. - Google Blog
• google-labs-code/design.md - GitHub Repository

Stitchは今年3月のアップデートで、エージェントが読み書き可能なように、プロジェクトのデザインルールや設計意図をMarkdownで記述するDESIGN.mdを導入した（当時の紹介記事があるので、そのときのDESIGN.mdのコラムも参照のこと⁠）⁠。DESIGN.mdを使うことで、エージェントは色やデザインルールの意図を推測ではなく、記述されているトークンや説明を手掛かりに理解できるようになる。そして、WCAGのようなアクセシビリティ基準に沿っているかも判断できるようになる。

今回のオープンソース化は、DESIGN.mdをStitch専用の仕組みにとどめず、こうしたデザインルールを外部ツールや他のワークフローにも適用するための動きといえる。

GitHubで公開されたREADMEと仕様書（/docs/spec.md）によると、DESIGN.mdでは、オプションで記述できるYAMLフロントマターで機械可読なデザイントークンを扱い、Markdown本文にその使い方や背景にあるデザイン意図を書く。こうして、色、余白、書体、角丸などの具体的な値と、それらをなぜ使うのか、どう適用するのかを同じファイルにまとめる。仕様上はYAMLフロントマター側でcolors、typography、rounded、spacing、componentsといったトークングループを扱うことができ、Markdown本文側ではOverview、Colors、Typography、Layout、Componentsなどの見出しを立てて構成する。

仕様書はDESIGN.mdを現時点でアルファ版と位置付け、仕様、トークンスキーマ、CLIが今後も変更される可能性があると明記している。また、仕様にない見出しがあってもエラーにはせず、未知のトークン名も値が妥当であればそのまま扱う。

Google LabsのDavid East氏によると、DESIGN.mdはレンダリング構文でもCSSの代替でもなく、特定の流儀を前提とするデザインシステムやコンポーネントライブラリでもないという。その代わり、なぜそのグリッドを使うのかといった設計意図や、ミニマリストなレイアウト、エディトリアルな見出し、あるいは「見出しはすべて大文字」「⁠サーフェスに純白の#fffを使わない」といった肯定的・否定的な制約を記述する。それによって、見た目の方針を示しつつ、エージェントのための持続的な文脈メモリになるとしている。

/packages/cliディレクトリには、DESIGN.mdを扱うCLIツールも用意されている。たとえばnpm install @google/design.mdでインストールすると、以下のようなサブコマンドを使えるようになる。これらのコマンドはnpx @google/design.md lint DESIGN.mdのように実行できる[1]。

• lint：壊れたトークン参照やコンポーネントのコントラスト比、見出しの順序などをチェックする
• diff：2つのDESIGN.mdの差分を比較する
• export：Tailwind CSSのテーマ設定、またはDTCG（Design Tokens Community Group）形式のトークンJSONへ変換する
• spec：仕様書やlintルール一覧を出力する

また/examplesディレクトリには、atmospheric-glass、paws-and-paths、totality-festivalの3つのサンプルが含まれる。各サンプルにはDESIGN.md本体に加え、そこから生成したTailwind CSS向けのテーマ設定ファイルtailwind.config.jsと、DTCG形式のトークンJSONであるdesign_tokens.jsonが含まれている。