开源工具能让AI写出大厂风格的前端设计

为什么你让 Codex / Claude 写的前端页面，永远一股浓浓的“开源模板味”？

因为你只会跟 AI 说：“帮我写一个现代、高级感、极简的落地页。” AI 心里的独白：“好，紫蓝渐变 + 圆角 16px + 默认 Tailwind 给你安排上。” 🙃

今天挖到一个很绝的宝藏开源项目：VoltAgent / awesome-design-md。

它把 Vercel、Stripe、Linear、Cursor 这些顶尖产品的 UI 规范，全逆向工程成了 AI 最懂的纯 Markdown 文件（DESIGN.md）。

很多人不知道，Google 之前推过一个概念叫 Stitch DESIGN.md：
不需要 Figma 插件，不需要复杂的 JSON，就用 纯 Markdown 规定好：
核心色盘与 Accent 角色
字体层级与行高节奏
组件规范（卡片到底要不要 border？阴影给几层？）
Do’s & Don'ts（明确禁止 AI 瞎加彩色渐变）

怎么用？

直接把你喜欢的风格（比如 Stripe 或 Vercel）的 DESIGN.md 扔进项目根目录，或者在 Cursor / Claude 里直接 @ DESIGN.md： “参考 DESIGN.md 的规范，帮我重构这个定价页面。”

出来的 UI 质感直接从“外包 Demo”拉升到“估值两千万的 SaaS 产品”。

程序员终于不用求着设计师给切图和规范了。

收藏起来，下次写前端直接抄作业 📌 （传送门已放留言区 👇）