awesome-design-md
A collection of DESIGN.md files analysis by popular brand design systems. Drop one into your project and let coding agents generate a matching UI.
在线试用
是什么
awesome-design-md 是 VoltAgent 维护的精选 DESIGN.md 资源库——把 Linear、Vercel、Stripe、Notion 等热门品牌设计系统逆向解析成 DESIGN.md token 格式（颜色、字体、间距、阴影等）。把对应 DESIGN.md 丢进项目,coding agent 就能按这套设计语言自动生成匹配 UI。属于设计 token + vibe-coding 的交叉地带。
什么时候用得上
- 1给月月做前端 demo 时直接借鉴某个品牌的 design tokens; 2) 改造现有页面统一视觉风格（参考 design-md skill）; 3) 学习大厂设计系统（不用 Figma 就能看 token 定义）; 4) 用 vibe-coding 思路让 AI 生成匹配品牌感的页面; 5) 学习 DESIGN.md 这种 token-as-code 的格式（design-md skill 在用的就是这套）
技术栈
DESIGN.md / design tokens / design-system / Figma / Google Stitch / vibe-coding
#awesome-list#design-md#design-system#design-tokens#figma#google-stitch#landing-page#vibe-coding#vibe-design#vibecoding