AI 写前端越来越“一眼 AI”了？ 最近又发现一个工具：Impeccable，一个给 Codex、Claude Code、Cursor 安装的一套“设计语言”的工具 更准确地说，Impeccable 是一套安装在 AI 编程工具里的“设计语言层”： 它通过设计知识、工作流命令、项目上下文和反模式检测，让 Codex、Claude Code、Cursor 等编码代理在修改前端时，少一些模型默认审美，多一些真正的设计判断。 平时我们给 AI 的设计要求可能会非常模糊，设计师有时候都未必能真正了解你的需求，何况是AI 所以Impeccable 想补齐那些专业性的知识要求。 它不会单纯告诉 AI“把页面做漂亮”，而是把设计工作拆成了多个可以明确调用的专业维度。 目前 Impeccable 提供了 23 个命令。它们并不只是一些短提示词，而是包含了相应设计领域的检查步骤、判断标准和工作方法。

很多 AI Skill，本质上只是一个更长、更专业的 Prompt。 Impeccable 真正有价值的地方，是把一次性提示词变成了可持续的项目设计上下文。 运行 /impeccable init 后，它会通过简单访谈了解产品服务谁、用户在什么场景下使用、品牌气质是什么，以及哪些风格绝对不能出现，并把这些信息写入 PRODUCT.md。 再运行 /impeccable document，它会扫描项目里的字体、颜色、组件和 Design Token，生成 DESIGN.md。 前者定义“产品为谁服务、为什么存在”，后者定义“产品应该如何表达”。 这样 AI 每次修改页面时，面对的就不再是一张白纸，而是一套已经建立好的设计系统。它不会今天用一套颜色，明天换一种圆角，后天新加的组件又完全不像同一个产品。

工作流基本可以分成四步。 第一步，先定方向。 新项目先用 init 保存产品上下文，再用 shape 明确设计方向，最后通过 craft 完成页面。品牌站和落地页还可以先生成视觉参考，再根据图片写代码，避免 AI 只靠文字自由发挥。 第二步，局部优化。 已有页面不需要全部重做，可以分别用 typeset、layout、colorize、animate 等命令，只解决排版、布局、配色或动效问题。 不知道哪里不对时，还可以用 Live Mode。直接在页面上点选元素，描述“更有力量”“信息密度更高”或“太像模板”，它会给出多个方案，预览后直接写回真实代码。 第三步，上线前检查。 先用 critique 做设计审查，再用 clarify 优化文案，最后通过 harden 测试超长内容、错误状态、离线、国际化等真实场景。 第四步，维护设计系统。 随着项目变大，extract 可以把重复的颜色、间距和组件整理成 Token 或公共组件，document 则负责更新 DESIGN.md。 所以 Impeccable 不只是帮你生成一个好看的页面，它更想解决的是：项目长期迭代中的设计一致性和设计债务。

Impeccable 里最有意思的功能，可能是它的“反 AI 味”检测器。 它整理了 46 类常见的 AI 前端套路，比如蓝紫渐变、渐变标题、霓虹发光、超大 Hero、卡片套卡片、统一圆角图标、过度弹跳动画，以及“重新定义”“下一代”“它不只是 X，更是 Y”这类空泛文案。 直接运行： npx impeccable detect src/ 就能扫描 HTML、CSS、React、Vue、Svelte、Astro 等项目，也可以检查线上网页。 如果项目里有 DESIGN.md，它还会判断新页面是否偏离原有的字体、颜色、圆角和字号规范。 更实用的是，它支持 JSON 输出和 CI 检查，可以直接放进 Pull Request 流程。Chrome 扩展还能在网页上直接标出问题。 所以它不只是提醒你“这个页面有点像 AI 做的”，而是把这些问题变成可以自动扫描、持续检查的工程规则。

使用 Impeccable 前，要先知道它并不是“万能设计师”。 它的审美规则很有立场，明确反对紫色渐变、玻璃拟态、极端圆角、弹跳动效等常见 AI 风格。 这样能减少模板感，但也可能从一种同质化，变成另一种同质化。 它也无法替代 Codex、Claude 或 Gemini。最终效果仍然取决于底层模型、项目上下文，以及 AI 是否真的看到了页面。 Live Mode 目前还在 Beta，复杂项目可能遇到兼容问题，使用时最好保持最新版，并关闭不可信网页。 想用好它，最重要的不是多跑命令，而是方法： 先运行 init，把用户、品牌语气、参考风格和反面案例写清楚； 不要一次检查整个网站，而是聚焦某个区域，比如首页 Hero 或结账表单； 推荐按 critique → polish → audit → harden 的顺序，先找问题，再修改、检查和测试异常情况。 每次修改后还要确认：重要信息有没有被删掉？操作是否变难？信息密度是否被过度降低？ 所以 Impeccable 更适合需要长期迭代、维护设计一致性的项目。把它当成设计协作者，而不是自动审批系统，效果会更好。

它和我之前分享的AI网页设计相关的工具有什么不一样能够？ 一句话概括： Impeccable 管完整设计流程，Emil 管动效细节，Website Cloner 管复制重建，Hallmark 管创意指纹，Taste Skill 管风格探索。 怎么选？ ·做长期维护的产品、Dashboard 或 SaaS：优先 Impeccable。 ·页面设计已经完成，只想提升动效和交互手感：使用 Emil Skills。 ·把有权使用的网站迁移成 Next.js：使用 AI Website Cloner。 ·从零做一个视觉差异明显的品牌页：优先 Hallmark。 想尝试多种美术方向、图片先行或调节视觉强度：使用 Taste Skill。 ·需要 CI 检查、设计系统上下文和生产质量控制：目前 Impeccable 最完整。 ·只想安装一个简单的反 AI 味生成规则：Hallmark 更轻量。 它们也可以按阶段组合： Hallmark / Taste Skill 确定最初的创意与视觉方向 ↓ Impeccable 记录 PRODUCT.md、DESIGN.md，完成实现与审查 ↓ Emil Skills 进行专门的动效和微交互打磨 ↓ Impeccable audit / harden 做上线前检查

🔗：

@realchendahuang 试试看？

但是这种必须基于已有的项目么，从零开始不行吧

一眼 AI 主要还是间距和阴影太爱用力了

23 个命令其实不多，但每个都带检查步骤，这种设计知识层确实是 AI 前端需要的补丁。