Awesome Design Skills：AI 写前端总算不用天天喊“毛玻璃风”了

用 AI 写前端界面，有个挺烦的小问题。

功能能跑，布局也能凑合，但一眼看过去，总觉得像同一个模板里倒出来的。

你想要毛玻璃效果，就得反复说透明度、模糊、阴影、渐变。

你想要极简风，又要补一句“不要太花，不要卡片堆满，不要大圆角滥用”。

说多了像在哄它。

最近看到一个项目，叫 Awesome Design Skills，做的事很直接：把这些风格描述提前写成技能文件，让 AI 编程工具自己照着来。

它现在整理了 67 套现成的设计系统技能。

我第一反应是，这东西其实不复杂，但刚好戳中 AI 写 UI 的痛点。

因为大多数人不是不会写提示词，而是不想每次从零开始描述“我要什么审美”。

这里的风格覆盖挺宽。

毛玻璃、新拟态、像素复古这些偏视觉感的有。

企业级后台、编辑排版、极简产品页这类偏工作流场景的也有。

也就是说，它不是只给你几套好看的皮肤，而是把“界面应该长什么样”拆成一套可以被 AI 读取的规范。

每套技能里有两份文件。

一份是给 AI 看的指令规范，告诉它组件怎么组织、颜色怎么用、间距怎么控制、视觉重点放在哪。

另一份是给人看的设计说明，方便你先判断这个风格是不是你要的。

这个设计挺实用。

很多时候我们让 AI 改界面，问题不是模型不会写 CSS，而是上下文里没有稳定的审美约束。

今天让它“高级一点”，明天让它“更干净一点”，最后出来的东西越来越玄学。

Awesome Design Skills 的思路是，把风格固定成项目资产。

一条命令就能把这些技能文件拉到项目里。

后面你让 AI 写页面、改组件、做 landing page，直接指定某个设计技能就行，不用每次重新念一遍咒语。

目前它已经适配了 Claude Code、Codex 这类主流 AI 编程工具。

也可以用交互命令浏览、预览不同风格。

甚至还能自己生成一套自定义风格。

这点对经常做小产品、Demo、开源项目首页的人会比较省事。

尤其是那种“功能已经写完，但界面看着很 AI”的阶段。

以前要么继续调提示词，要么自己下场一点点修。

现在可以先选一套风格，把方向钉住，再让 AI 往里填。

当然，它不是设计师替代品。

复杂品牌系统、商业级视觉稿，还是得靠人把关。

但对 AI Coding 里的前端生成来说，它至少解决了一个很具体的问题：别再让界面每次都长成默认模板。