Awesome DESIGN.md

正常
GitHub Unknown MIT

简介

Awesome DESIGN.md 是一个受流行品牌设计系统启发的 DESIGN.md 文件集合,可放入项目中让编码 Agent 生成匹配的 UI,为 AI 编码 Agent 提供设计系统参考。

核心特性

  • 72+ 品牌 DESIGN.md 文件 — 收录 Claude、Vercel、Linear、Notion 等知名品牌的完整设计系统文档
  • AI Agent 可读格式 — 纯 Markdown 文件,无需 Figma 或特殊工具,LLM 直接解析
  • 设计 Token 与模式 — 包含颜色、字体、间距、组件模式等深层设计规则,非表面级描述
  • 多领域分类 — 按 AI 平台、开发工具、SaaS、设计工具、金融等类别组织
  • 一键复制使用 — 将 DESIGN.md 放入项目根目录,AI 编码 Agent 即可生成匹配的 UI

适用场景

💡 让 AI 编码 Agent 生成与知名品牌风格一致的 UI 界面
💡 为新项目快速建立设计系统参考,避免从零开始
💡 学习优秀品牌的设计模式、Token 体系和组件规范
💡 在 DESIGN.md 和 AGENTS.md 配合下实现设计-开发一体化工作流

快速开始

# 克隆仓库获取所有 DESIGN.md 文件
git clone https://github.com/VoltAgent/awesome-design-md.git
cd awesome-design-md

# 选择一个品牌的 DESIGN.md 复制到你的项目根目录
# 例如使用 Vercel 的设计风格:
cp collection/vercel/DESIGN.md /your-project/DESIGN.md

# 然后告诉你的 AI 编码 Agent:
# "按照 DESIGN.md 中的设计规范构建一个落地页"

相关项目