articles
awesome-design-md：把網站設計語言整理成 DESIGN.md，直接餵給 coding agent
VoltAgent/awesome-design-md 將熱門網站設計語言整理成 DESIGN.md，讓 coding agent 生成一致 UI。已補上 2026-07 repo stats、MIT license、73 份 DESIGN.md 與實務 caveat。
2026年4月7日3 分鐘閱讀👁 17
AI UI Design / DESIGN.md / Coding Agents
awesome-design-md：把「好看的 UI」拆成 agent 可讀的設計語言
VoltAgent/awesome-design-md 是一套 ready-to-use
DESIGN.md collection：把熱門產品的視覺語言整理成顏色、字體、間距、元件規則、排版語氣與 do/don't，讓 coding agent 生成 UI 時有設計系統可依循，而不是只靠模糊的「做得像 Linear / Vercel / Claude」。
2026-07 更新：GitHub metadata 顯示
VoltAgent/awesome-design-md 採 MIT License，README 標示 DESIGN.md count 為 73；查證時約 101K stars / 11.6K forks，homepage 為 getdesign.md。Star / fork 數屬時間敏感指標，只作社群熱度參考。它是什麼
awesome-design-md 是一組 ready-to-use DESIGN.md collection。README 顯示它收集多個品牌 / 產品風格分析，例如 Claude、Cohere、ElevenLabs、Mistral、Ollama、Cursor、Vercel、Warp、Supabase、Linear、Notion、Figma、Webflow、Stripe、Coinbase 等。
為什麼對 AI UI 有用
AI 可以快速生成畫面，但常輸出「看起來像模板」的 UI。DESIGN.md 把審美拆成可讀規格：色彩 token、typography、spacing、rounded、component 行為與設計 rationale，讓 agent 有更穩定的視覺約束。
和 AGENTS.md 的關係
README 的比喻很清楚：AGENTS.md 告訴 coding agent「怎麼建專案」；DESIGN.md 告訴 design / coding agent「這個專案應該長什麼樣」。前者是工程流程，後者是視覺語言。