DESIGN.md(AI设计系统文档)
A collection of DESIGN.md files by popular brand design systems. 放进项目,AI 就能按指定风格生成界面。
Key Points
- 核心理念:Google Stitch 提出的 DESIGN.md 概念——纯文本设计系统文档,AI Agent 读取后生成一致 UI
- 无需 Figma 导出、JSON schema、特殊工具,只要一个 markdown 文件
AGENTS.md管编码 Agent,DESIGN.md管设计 Agent
收录内容(72+ DESIGN.md)
| 类别 | 品牌 |
|---|---|
| AI & LLM平台 | Claude、Cohere、ElevenLabs、Minimax、Mistral AI、Ollama、OpenCode AI、Replicate、Runway、Together AI、VoltAgent、xAI |
| 开发者工具 & IDE | Cursor、Expo、Lovable、Raycast、Superhuman、Vercel、Warp |
| 后端、数据库 & DevOps | ClickHouse、Composio、HashiCorp、MongoDB、PostHog、Sanity、Sentry、Supabase |
| 生产力 & SaaS | Cal.com、Intercom、Linear、Mintlify、Notion、Resend、Zapier |
| 设计 & 创意工具 | Airtable、Clay、Figma、Framer、Miro、Webflow |
| 金融 & 加密 | Binance、Coinbase、Kraken、Mastercard、Revolut、Stripe、Wise |
| 汽车 | BMW、BMW M、Bugatti、Ferrari、Lamborghini、Renault、Tesla |
每个 DESIGN.md 包含
| 章节 | 内容 |
|---|---|
| Visual Theme & Atmosphere | 氛围、密度、设计哲学 |
| Color Palette & Roles | 语义名 + hex + 功能角色 |
| Typography Rules | 字体家族 + 完整层级表 |
| Component Stylings | 按钮/卡片/输入/导航(含状态) |
| Layout Principles | 间距 scale、grid、留白哲学 |
| Depth & Elevation | 阴影系统、表面层级 |
| Do's and Don'ts | 设计护栏和反模式 |
| Responsive Behavior | 断点、touch targets、折叠策略 |
| Agent Prompt Guide | 快捷配色参考、可直接用 prompt |
使用方法
- 复制目标站点的
DESIGN.md到项目根目录 - 告诉 AI agent:"build me a page that looks like this"
数据
- 87.8k Stars · 10.5k Forks · 288 Issues
- GitHub Rank #150
Related Pages
- products/open-design — 开源 Claude Design 替代
- patterns/ui-polish — UI精致打磨
Sources
- GitHub VoltAgent/awesome-design-md (2026-06-04)