开源前端设计工具 Impeccable 3.5：按模型专治「AI 味」，支持代码实时直改

让大模型写个网页界面，很多人第一眼就看得出来：又是那套熟悉的米黄底色、细边框大阴影，加上拉得极开的字母间距。

大家都在用 AI 写前端，但模型其实根本不懂审美。开源前端设计工具 Impeccable 的团队测了数千次生成结果，发现 74% 的页面都在用 AI 默认的米白背景，76% 乱用极端字间距，90% 以上甚至连最基础的对比度要求都达不到。Anthropic 的 frontend-design 和旧版 Impeccable 自己也没能逃过这些通病。

Impeccable 发布了 3.5 版本。他们决定不再给所有模型塞同一份提示词，而是针对每家模型的具体毛病，逐个对症下药。

专治各家模型的审美毛病

Impeccable 3.5 最聪明的地方，是在构建阶段为不同模型编译专属的约束规则。比如针对 GPT-5.5 和 Codex，团队专门写了针对它们高频设计缺陷的规则，这些规则别的模型根本看不到。

团队通过挖掘约 190 个样本的偏见，直接禁止了一长串典型的 AI 设计套路：暖中性色调里的米色背景全面禁用，全大写的小标题、带编号的模块标记、超过三种字体通通被砍，还设立了硬性的对比度底线。

新版本还会分辨新老项目。如果是现有代码库，它先读取现有的设计规范和组件，优先保留原有风格；如果是从零起步的全新项目，它会从 129 个精心挑选的锚点颜色中抽取种子，再手动围绕它生成完整配色，不会让每次冷启动都退化到千篇一律的安全色。

浏览器里直接改，改完写回源码

除了审美规则，这次另一个重头戏是进入 Beta 阶段的 Live 模式。以前你让 AI 改界面，往往是在对话框和编辑器之间来回复制，现在可以在页面上直接操作。

在新的 Steer 栏里输入或直接语音说出修改要求，Agent 会直接阅读整个页面并在原地修改。你也可以单独点选一个元素，用自然语言微调，甚至直接在浏览器里改文案，点一下应用，后台的子 Agent 就会把修改直接写回源码文件。

为了让这些检查跑得足够快，团队彻底抛弃了重量级的 jsdom，换成了自研的 CSS 级联解析器。在 160 个 HTML 文件的测试集上，耗时从 6.8 秒暴降到 0.34 秒，速度提升了约 20 倍。体积缩小后，41 条反模式检测规则可以直接内嵌在技能里实时运行。

目前 Impeccable 完全免费开源，支持 Claude Code、Codex 和 Cursor 等主流开发环境。只要在终端跑一条不带参数的命令，它还会自动扫描你的代码库和 git 状态，告诉你下一步最该执行什么操作。

为什么重要

很多开发者抱怨 AI 生成的 UI 能用但很难看，修起来反而比自己写还费劲。Impeccable 3.5 给出了一条很实际的路径：不要指望大模型突然顿悟美学，而是用工程化的规则去卡死那些廉价感。

对独立开发者和前端工程师来说，这个工具非常值得放进 Cursor 或 Claude Code 里。特别是 Live 模式，把改字、调样式变成了所见即所得的交互，还能无缝写回代码，大大缩短了调试循环。冷启动自带的 129 个配色种子，也让一人项目告别了千篇一律的「AI 味」。

我们认为，Impeccable 这种「按模型定制提示词与编译规则」的思路，比同行通用的通用提示词要聪明得多。每个大模型的训练偏差完全不同，通用约束往往两头不讨好。不过这也意味着维护成本成倍增加，未来主流模型一旦频繁迭代权重，这套反模式规则就需要持续更新和测试，长期维护是一场硬仗。