你试过用 AI 做网页吗？
跟它说"帮我做个产品官网"，等几分钟，代码出来了，页面打开，第一感觉：不丑。第二感觉：也说不上好看。深色背景、紫蓝渐变、居中大标题，下面三张功能卡片，按钮发着光。知乎换个提示词再来一遍，紫色变蓝色，卡片三张变四张，还是一眼就能看出是 AI 做的。
这不是你一个人的问题。小红书、知乎上用 vibe coding 做页面的人，几乎都栽在同一个坑里。一篇叫《如何 coding 出你的第一个漂亮网站》的笔记，光是一句"做出来的东西不丑，但也说不上好看"，就引来 9000 多次收藏。小红书更有意思的是：为了治这个"AI 味"，GitHub 上已经打起了一场军备竞赛。今天把这件事捋清楚。
一、AI 为什么总做出一样的页面
先说结论：不是模型笨。AI 写的代码通常没什么毛病，问题是它没有设计判断力。知乎AI 在训练数据里看到的"好看设计"，高度集中在几种模式上——海外 SaaS 产品页几乎都是同一张脸：深色首屏、渐变文字、卡片布局、发光按钮。你让它自由发挥，它就只会在这几种模式里来回倒腾。Google Chrome 团队出身的开发者说得直白：所有模型都在同一批 SaaS 模板上训练，写出来的前端注定撞脸。知乎
所以解法不是"让 AI 写出更好的代码"，而是给它补上设计判断。用社区的话说：AI 懂什么叫高级？那就给它一个标准。
目前社区的做法，大致是四条路。
二、规则派：给 AI 装一位设计总监
最典型的是 frontend-design，Claude Code 官方插件仓库里的第一个 skill，思路是把规则写死：Inter、Roboto、Arial 这类烂大街字体不许用，被用滥的紫色渐变严禁，布局鼓励不对称、错位、对角流动。知乎它甚至要求每次生成换字体、换主题——同一个提示词跑两次，出来的东西不该一样。
社区最热的是 Taste Skill，GitHub 超过 5 万 Star。知乎它把"高级感"这种玄学变成三个可调参数：布局有多大胆、动效有多丰富、信息有多密集，默认值 8/6/4。知乎还预置了极简编辑风、粗暴工业风、克制高级感等子技能，按场景挑。
再狠一点的是 Impeccable，Google Chrome 团队出身的开发者做的：44 条硬规则，AI 每次改 UI 文件自动检查一遍，对比度不够、字号层级混乱、动效曲线不对，直接打回。知乎这一派的本质，是给 AI 配了位严格的设计总监：先想清楚风格、层级、动效、密度，再动手写代码。
三、参考派：别让 AI 凭空想，给它喂标准
不想装任何东西，走这条最省事。
有人做了 Awesome Design.md，GitHub Star 超过 9 万，收录 73 个知名网站的设计风格，每种风格一份 AI 能直接读懂的 DESIGN.md。知乎想做"Claude 官网那种感觉"的页面，不用丢截图，把对应的 DESIGN.md 喂给 AI 照着写就行。
还有 styles.refero.design，把 2000 多个顶级产品网站的设计系统提取成结构化规范，颜色、字体、间距、组件规则全是可读文本，拿来即用。知乎知乎上还有个更接地气的版本：做页面之前别对 AI 说"帮我做个高级网站"，直接把你觉得做得好的参考网站扔过去，让它解析构图、信息层次、动效节奏，再做个风格接近的。知乎答主特意提醒：以学习为主，不要商用。
四、复刻派：直接克隆，换内容——争议最大的一条路
小红书一篇叫《这就是 Codex 设计网站的焚诀》的笔记，一句话引来 720 条评论：把目标网站复刻下来，替换成自己的文字图片，“前端真的不用学了”。小红书GitHub 上现成的工具叫 ai-website-cloner-template，Star 数几天冲到 2.5 万：给一个网址，跑一句 /clone-website，几分钟后拿到完整的 Next.js 代码，组件、样式、图片、字体全部还原。知乎
但这里必须说两句。第一，这类工具的官方定位是学习参考、迁移自己的网站，不是照着别人的站做商用仿品，更不能碰钓鱼。知乎第二，"前端不用学了"是引战说法——那 720 条评论就是在吵这件事，接单市场里已经出现"AI 造成反向淘汰"的抱怨。水比想象的深。
设计师还有个配套工具：Copyframe 这类浏览器插件，把任意网页一键转成可编辑的 Figma 图层——不是截图，是能改文字、调颜色、拖位置的图层。哔哩哔哩
五、出图派：先生成设计图，再让 AI 照着画
最后一条路讨论少，但实用：别让 AI 直接写代码，先用图像 AI 出一张设计参考图，再让写代码的 AI 对着图实现。设计决策先在图里定死，AI 只负责照着翻译，没有自由发挥的空间，产出质量往往比直接写代码高一截。知乎
六、不同人怎么选
- <#&!53#&!>
长期用 vibe coding 做落地页、官网、Demo：装规则派，Taste Skill 或 frontend-design 装一次长期受益；
有特别喜欢的网站想学：复刻派最快，但记住红线——学结构，别商用；
设计师：Copyframe + 参考派，把 AI 当助手而不是替身。
零基础、只想快速出个好看的个人页：走参考派，零安装，丢一份 DESIGN.md 就能用，成本最低；
最后说句清醒话：这波工具爆发，恰恰说明"AI 生成"已经是底线，不是天花板。工具能去掉表面的 AI 味，但真正拉开页面差距的还是审美判断——那东西目前只能靠看好作品一点点攒。可以持续留意：把审美经验变成 AI 可读文档的项目，很可能成为下一阶段的基础设施。
你用 AI 做页面遇到过哪些"AI 味"？评论区聊聊。
