impeccable：把前端设计拆成 24 条智能体指令

npx skills add pbakaus/impeccable --skill impeccable

让智能体「把界面改好看一点」，它回一句「已优化视觉层次」，页面还是原来的样子。impeccable 是 Paul Bakaus（jQuery UI 作者）开源的前端设计 skill，在 Anthropic frontend-design 的思路上继续往前走：把「改好看」拆成 24 条可以点名的指令，再配一套不跑模型的检测规则，让 Claude Code 这类编程智能体的界面产出有章可循。截至 2026-09-28，这个 Apache-2.0 仓库在 GitHub 已有约 7.2 万星。

它把设计拆成指令

impeccable 的操作都从 /impeccable <command> 进：init 先把产品定位、受众这些事实写进 PRODUCT.md，document 从现有代码反推 DESIGN.md；动手时按意图点名——polish 收尾、audit 查无障碍和响应式、harden 补错误提示和 i18n、bolder 和 quieter 调整浓淡、distill 做减法、live 在浏览器里逐个元素迭代。每个界面先归入一种场景：落地页要 Persuade，后台要 Operate，文档要 Read，好坏标准各不相同。它还限定自查轮数：批量看一轮，一次改完，最多再确认一轮就收手，不把 token 烧在无限打磨里。

不用模型的检测器

这 61 条规则由随 skill 分发的 CLI 和浏览器扩展直接执行，不调用 LLM，也不需要 API key：紫蓝渐变、卡片套卡片、彩色底上放灰字、bounce 缓动这类 AI 味，加上行宽过长、触控目标过小等通用问题，都在扫描范围内。npx impeccable detect 能扫目录、单个 HTML 文件或线上 URL，--json 输出可以接进 CI。装在 Claude Code、Codex、Cursor 里时，它还会挂一个钩子，每次改 UI 文件后自动扫一遍。README 自己也提醒：检测全绿是证据，不等于体验合格。

官方案例的成色

impeccable.style 上的 Neo Mirai 案例演示了 comp-first 路径：把两张 GPT Image 生成的参考图（页面 mockup 和品牌工具包）构建成一个能用的响应式会议站，导航、轮播、悬停态俱全。整页效果如下：

适合谁

天天让智能体写界面、又总要亲手把模板感改掉的人，值得把它装进项目。起步两步：npx impeccable install 装进仓库，再到智能体里跑 /impeccable init。三点要留意：首次运行会下载一个引擎二进制放进 ~/.impeccable/bin/；Claude Code 里这个钩子独立于模型工具审批自动运行，README 建议无人值守的会话先审查钩子；24 条指令覆盖面很宽，交任务时指明具体目标（比如「只改注册表单的错误提示」），否则容易在打磨里绕圈。Cursor、Gemini CLI、GitHub Copilot 等一串工具都在支持之列。