上周帮人看一个落地页。打开的第一秒我就说了句「这是 AI 写的吧」。对方愣了一下，问怎么看出来的。我说不是因为丑，是因为太熟了：紫到蓝的渐变背景、居中的大标题、下面整整齐齐三张功能卡、卡片里放三个线性图标、按钮后面粘一个箭头，底部再补一句听起来很宏大但没有主语的标语。
这套东西单看都不算错。问题是，一个儿童识字应用、一个银行对账系统、一个摄影师作品集，最后长成了三兄弟。
一眼认出来的那几样，其实有清单
把常见的机器味列出来，大概是这样几类。
颜色上，紫蓝线性渐变排第一，其次是渐变文字、发光边框、没有任何来源的模糊光球。排版上，标题上方总挂一个字母间距拉大的小标签，英文里叫 eyebrow；卡片套卡片；三张卡片一模一样只换图标。文案上，按钮后面必粘箭头，标题爱用中点分隔的三段式，工具名一律加粗当卖点。数据上最要命：编造的用户数、编造的客户 logo、编造的评价。
这些东西不是审美问题，是概率问题。
模型为什么总挑同一套
写代码这件事，模型是按概率出牌的。你说「做一个现代、简洁、有科技感的 SaaS 官网」，这句话在训练数据里对应过几百万个页面，其中出现频率最高的组合就是白底、紫蓝渐变、三卡、圆角胶囊按钮。模型不是在设计，是在还原那个平均值。
这也解释了为什么你越说「再高级一点」，页面越花：高级感是个没有刻度的词，模型只能加特效。真正有效的指令不是「更好看」，是「不许做什么」加「必须满足什么」。
这三个技能包，做的就是这件事。
三个包，各管一段
先说 Hallmark。它出自 Nutlope 之手，背后是 Together AI，MIT 许可，给 Claude Code、Cursor、Codex、OpenCode 这类智能体用。它的定位写在标题里：拒绝看起来像 AI 生成的。
它最有价值的部分不是那套主题，是三层检查机制。第一层叫 Floor，十六条底线，不可豁免：颜色和字体必须走 CSS 变量，不许在组件里写死色值；不许用 transition: all；只许动 transform 和 opacity，不许动宽高和内外边距；html 和 body 都要声明 overflow-x: clip；图片网格轨道必须用 minmax(0, 1fr)。这些听着像工程规范，其实是把「廉价感」翻译成了可判定的条件。第二层叫 Reflex，专治惯性，比如滥用渐变文字、没有理由的装饰，但允许你写清理由后豁免。第三层叫 Finish，管排版节奏和视觉平衡这类不影响交付、但影响质感的东西。
再说 Impeccable。作者是 pbakaus，Apache-2.0，主体用 Rust 写。它更像一套操作语言：二十四条命令，audit 审、critique 评、polish 打磨、typeset 调字、bolder 加重、quieter 收敛，还有浏览器里实时改的模式。它用一份 PRODUCT.md 记住业务意图，一份 DESIGN.md 管视觉 token，两边分开，避免「好看」压过「该干什么」。检测规则五十九条到六十一条，跑在本地，不调模型、不要 API key。
第三个是 unslop，体量小得多，六颗星级别的项目里算跑得快的，专抓一件事：紫色渐变、发光、emoji 当标签、喊话式文案，然后一屏一屏重做。
三者的关系不是替代。Hallmark 立规矩，在你动手之前把底线钉住；Impeccable 管迭代，改一个已有页面时一条命令一条命令地推；unslop 是急诊，页面已经烂了，直接拉去重排。
四步上手，别跳第一步
安装不复杂，以 Hallmark 为例，Node 十八以上，一行命令全局装：npx skills add nutlope/hallmark -g。去掉 -g 就是只装在当前项目。装完在 Claude Code 里用 /hallmark 唤起，审计已有页面用 /hallmark audit ./index.html，重做用 /hallmark redesign ./src/app。
但真正决定结果的不是命令，是顺序。
第一步，先把产品说清楚。不是「做个官网」，是这个页面唯一的任务是让人下载、还是让人打电话、还是让人读懂文档。Hallmark 的整套逻辑是「按任务定骨架」，任务说错了，后面全是白搭。
第二步，提供真材料。真实截图、真实品牌色、真实客户。它有条规则专门拦编造：不许凭空生成评价、客户数、合作 logo。你给它空白，它就容易编；你给它素材，它才有的放。
第三步，先只做首屏。这是我觉得最实用的一条。AI 一次性生成八个章节，最容易烂的就是第一屏——而第一屏决定人要不要往下滚。Hallmark 明确要求先建首屏、渲染、评审，再做剩下部分。
第四步，用浏览器验收，不是看代码。它的 sloplint 支持 –render，在八种视口宽度下检查真实渲染。代码里看着没问题、跑起来标题换行、按钮被遮住、手机端横向溢出，这些只有渲染才看得见。这一步要 Chrome 和 puppeteer-core，环境没配只能跑静态检查，别把静态通过当成验收通过。
代价：规则是别人的审美
三个包都不是免费的午餐，只是账单不在钱上。
第一笔账是审美归属。Hallmark 禁紫蓝渐变、禁标题上挂小标签，可这两样本身不是错误，有些品牌就是要那个调子。它把一套明确的设计取向写成了硬规则，你用了，就等于接受了别人的判断。真要用在企业项目上，正确做法是留它的机制，改它的清单。
第二笔账是依赖和痕迹。Impeccable 首次运行会往用户目录下拉一个二进制，会在项目里写一堆 .impeccable/ 工作文件，得自己加进 .gitignore；遥测默认开着，要手动关；编辑钩子还得在每个工具里单独授权信任，有两个 harness 干脆没有。多一层工具，就多一个会坏的地方。
第三笔账最容易被忽略：检查通过不等于好看。这些规则拦的是「明显的坏」，不是「真正的好」。一个页面把十六条底线全过了，仍然可能毫无记忆点。规则能提高下限，抬不动上限。
顺带说个口径问题。这几个项目的主题数、命令数、检测规则数，各家报道写得都不一样：主题有说二十一套的，有说四十八套的，也有说五十套的；命令有写二十三条也有写二十四条；规则有写五十九条也有写六十一条。数字还在动，看趋势就行，别拿某一个数当准。
谁该装，谁别折腾
值得试的：一个人维护站点、又没有设计师的；接落地页和官网外包、交付前想快速过一遍的；用智能体批量生成页面、需要统一质量下限的。
不建议的：已经有企业设计系统、品牌手册写得很细的，套上去只会打架；做原生 App 的，这些规则基本针对 HTML 和 CSS；还有只偶尔让 AI 写个页面的，装完学习成本比省下的时间长。
替代方案也说两个。最土的是自己写一份 DESIGN.md 塞进仓库，把色板、字号、间距、禁用项列清楚，让智能体每次先读它，效果能拿到六七成，成本几乎为零——站内微软总结九类翻车模式那篇讲的是同一个道理：能编译不代表对，得有检查。另一条路是把设计规范做成团队自己的技能包，这个方向在 WorkBuddy 开放 Skill 变现那篇里聊过，未来更值钱的可能是「某个行业的设计约束」，而不是又一套模板。
老达点评
我自己的博客改版时踩过这个坑。让 AI 出方案，三版里有两版是紫蓝渐变加三卡，第三版换成了深色加光效，本质还是同一套。后来我发现，跟它说「再改改」是没用的，得说「首屏只要一个输入框和一句人话，不许放功能卡」，它才真的换结构。
所以这三个包真正的贡献，不是让 AI 变好看了，是把「不许做什么」变成了机器能执行、能复核的东西。这件事比多给几套主题重要得多。设计行业一直有个说法：规范的价值不在于限制创意，而在于把低级错误挡在交付之前。现在这套逻辑被搬进了智能体的生成流程里。
但也别指望它解决根本问题。AI 之所以做出千篇一律的页面，是因为它在还原平均值；规则能拦住平均值里最难看的那部分，拦不住「没有观点」这件事。真正的差异还是来自你知不知道自己这个页面要干什么。这一点，任何技能包都替不了。
想继续看这类工具链的实操，AI 编程工具专题按场景分得比较细；单纯想比较工具优劣，AI 工具评测专题里收得更全。另外两篇可以对着读：一篇讲 Cursor 把智能体拆成一个文件夹，说的是接口怎么标准化；一篇讲 T3Code 用一块屏管五个智能体，说的是并行之后人怎么验收——设计检查其实也是同一件事，都是把「看一眼」变成「跑一遍」。
