Google Stitch 团队在2026年3月推出了 DESIGN.md 概念——一种纯 Markdown 格式的设计系统文件，专为 AI 编码代理设计，让 Claude Code、Cursor 等工具在生成 UI 时能自动遵循品牌视觉规则。社区开发者 VoltAgent 随即在3月31日上线了 awesome-design-md 仓库，收录60多个知名网站的 DESIGN.md 文件，上线10天内 GitHub 星标从零突破35000（截至发稿约36800颗），fork 数超4600，成为2026年4月增长最快的开源项目之一。 解决什么问题：AI 生成 UI 的"风格失忆症"
用 AI 编码代理写前端代码的人都遇到过同一个问题：你在提示词里描述了品牌配色和字体，AI 生成了一个按钮组件，然后你让它生成一个卡片——间距、颜色、字重全变了。每次生成都像是一个新设计师接手，完全不记得上一屏长什么样。
根本原因是 AI 编码代理没有持久化的设计系统上下文。你每次对话都在从零描述视觉规则，而这些描述在下一轮对话中就消失了。
DESIGN.md 的做法很简单：把整个设计系统写进一个 Markdown 文件，放在项目根目录。AI 代理在生成每一段前端代码时都会读取这个文件，确保输出遵循统一的视觉规则。Markdown 是 LLM 原生最擅长理解的格式——标题表示层级、列表表示枚举、加粗表示重点——不需要 JSON schema、Figma 导出或任何专用工具链。
据 MindStudio 的技术解析，每份 DESIGN.md 通常包含9个部分：视觉主题与氛围描述、语义化色盘（含亮/暗模式）、排版层级（字体族、字号、字重、行高）、组件样式与状态（按钮、卡片、输入框等的具体 CSS 值）、布局原则与间距系统、阴影与层级系统、响应式规则、设计禁区（Don'ts），以及给 AI 的特定 prompt 指导。
Google Stitch：DESIGN.md 的发源地
DESIGN.md 概念由 Google Labs 的 Stitch 项目正式引入。Stitch 于2025年5月上线，2026年3月19日发布重大更新，从原型设计工具进化为"AI 原生软件设计画布"。据 Google 官方博客，更新后的 Stitch 支持从任意 URL 自动提取设计系统、导出为 DESIGN.md 文件、语音交互式设计迭代，并通过 MCP 服务器和 SDK 与 Claude Code、Cursor 等编码代理打通。
Stitch 的核心工作流是：你输入一个网站 URL → Stitch 用 Gemini 分析页面的视觉语言（颜色、排版、间距、组件风格）→ 提取设计令牌并生成 DESIGN.md → 你把这个文件丢进代码项目 → 告诉 AI 代理"按这个风格生成页面"。整个过程大约15-45秒完成提取。 据报道，Stitch 这次更新的相关讨论在 X 上超过1590万次浏览，Figma 股价在消息发布当天下跌8.8%。Google 目前在 Labs 阶段免费提供 Stitch，每月350次免费设计生成额度，底层使用 Gemini 2.5 Pro。
不过需要注意，Stitch 的设计提取仍存在稳定性问题。Medium 上一位设计师的实测报告指出，尝试从 URL 创建自定义设计系统时，Stitch 出现了"hit a temporary technical limit"的错误提示，功能还不完全稳定。
awesome-design-md：社区把概念变成了即用资源库
VoltAgent 维护的 awesome-design-md 仓库把 DESIGN.md 概念从 Stitch 生态扩展到了整个 AI 编码代理领域。据 SimpleNews 报道，仓库上线3天即获4385颗星标；截至4月10日，已积累约35000-37000颗星标（不同页面显示的实时数据略有差异）。
仓库当前收录了60多个品牌的 DESIGN.md 文件，覆盖6个类别。AI 工具类包括 Claude、xAI、Mistral AI、Cursor、ElevenLabs 等；开发者平台类包括 Vercel、Linear、Supabase、Sentry、Expo 等；设计/SaaS 类包括 Figma、Notion、Framer、Miro、Webflow 等；消费品牌类包括 Apple、Airbnb、Spotify、Uber 等；金融/加密类包括 Stripe、Coinbase、Kraken 等；汽车类包括 Tesla、BMW、Ferrari、Lamborghini、Renault 等。
每个品牌目录包含 DESIGN.md 源文件和 preview.html 预览文件（支持亮/暗模式本地预览）。使用方式是：复制某品牌的 DESIGN.md 到你的项目根目录 → 在 Claude Code/Cursor 中输入"build me a page that looks like this" → 代理读取文件并生成匹配风格的 UI。
官方浏览网站 getdesign.md 提供分类浏览、即时预览和一键下载功能。社区还有人提交了将整个仓库打包为 Claude Code Skill 的方案（Issue #90），安装后可直接说"build me a page like Stripe"触发对应的设计系统。
竞品与局限：不是设计系统替代品
DESIGN.md 与传统设计系统工具（Figma Design Tokens、Style Dictionary、Tailwind Config）的定位不同。传统工具输出的是精确的 JSON/JS 令牌文件，面向构建工具和 CSS 预处理器；DESIGN.md 输出的是自然语言描述的设计规则，面向 LLM 的上下文理解。据 MindStudio 分析，DESIGN.md 不是完整设计系统的替代品，而是"令牌级别的子集，AI 可以在生成过程中机械性地消费和应用"。成熟团队通常同时维护 Figma 设计系统和 DESIGN.md。
与 Anthropic 的 AGENTS.md、CLAUDE.md 等文件的逻辑一致：用一个项目根目录下的 Markdown 文件为 AI 代理提供持久化上下文。YouMind 的分析文章将 DESIGN.md 类比为"设计领域的 AGENTS.md"——用人和 AI 都能读写的文件来约束 AI 行为。
局限方面：第一，awesome-design-md 仓库中的设计令牌是从公开网站的 CSS 中提取的，仓库明确声明"不声称拥有任何网站的视觉标识"，但使用这些文件复刻品牌 UI 在商业项目中可能涉及商标和视觉版权问题。第二，提取的设计令牌反映的是网站某一时刻的公开 CSS 值，品牌方更新设计后 DESIGN.md 不会自动同步，存在过期风险。第三，AI 代理对 DESIGN.md 的遵循程度取决于模型能力和提示词质量，"像素级匹配"更多是理想情况而非保证——复杂的组件交互状态、动画、响应式断点等在纯文本描述中很难完全精确。第四，仓库由 VoltAgent（一个 AI 代理框架团队）维护，CONTRIBUTING.md 明确表示"不接受 DESIGN.md 的 PR 提交"以维护质量，但这也意味着更新频率取决于维护者的投入。第五，仓库增长速度异常快（10天3.5万星），这种爆发式增长的项目在后续维护和质量控制上能否持续是一个常见风险。
官网：https://getdesign.md
