按任务拆分的设计命令
官网文档把命令分成创建、评估、精修、简化、加固、系统六类,例如 polish 打磨页面、typeset 优化排版、distill 减少杂乱、harden 处理异常数据下的可用性,按任务点名调用。
拖动滑块完成拼图,通过后发送验证码
独立第三方 AI 评测平台 · 只用实测数据
Impeccable 是 Paul Bakaus 创建的开源 AI 前端设计技能包,定位于「给智能体补上缺失的设计词汇」:它让 Codex CLI、Claude Code、Cursor 等编程智能体从零构建设计、改进现有界面,并保持与既有设计系统一致。核心优势是按任务拆分的设计命令(polish、typeset、distill、critique 等)与一套在代码里运行的「AI 特征检测器」,可在智能体改页面时即时发现并回传问题,无需 AI 模型或 API key。短板是它依附于宿主编码工具,需要先完成安装与 hooks 审批配置,且国内用户访问官网与安装源可能受网络环境影响;效果高度依赖使用者对设计目标的表达能力。
Impeccable 是一套面向 AI 编码智能体的前端设计技能包(skill),作者为 Paul Bakaus,开源免费。它不是组件库也不是 CSS 主题,而是一层「设计词汇」:通过参考文件、斜杠命令与反模式规则,教你的智能体写出真正有设计判断的界面代码。
展示的能力包括:智能体扫一遍代码库即可加载既有颜色、字号、间距与组件体系(示例中为 14 个颜色、6 个字号、7 档间距、34 个组件),并用 PRODUCT.md 记录用户与产品目标、用 DESIGN.md 记录视觉系统。它还内置一个「AI 特征检测器」,在智能体编辑页面时检查 AI beige、斜体衬线、脉冲圆点等典型 AI 审美痕迹,发现问题直接回传给智能体修复,检测环节在代码中运行,不需要 AI 模型或 API key。
普通开发者可以在自己的项目里用 /impeccable polish 等命令对现有页面做改进;团队可以用它把设计规则沉淀成 DESIGN.md,让后续功能与下一个智能体都遵守同一套标准;还可以配 Chrome 扩展在 DevTools 面板里查看页面问题,或在 CI 中跑检测器扫描并返回退出码。
官网文档把命令分成创建、评估、精修、简化、加固、系统六类,例如 polish 打磨页面、typeset 优化排版、distill 减少杂乱、harden 处理异常数据下的可用性,按任务点名调用。
设计 hooks 会在智能体编辑 UI 时检查改动并回传发现,官网示例能识别 AI beige、斜体衬线、侧边标签、脉冲圆点等典型 AI 审美痕迹;检测在代码里运行,不需要 AI 模型或 API key。
官方说明 ↗运行时扫描代码库,加载 tokens.css 里的颜色、字号、间距与 tailwind 配置,合并 tailwind.config.ts 的 theme.extend,新页面按既有组件与规则生成,保持产品风格一致。
用 PRODUCT.md 记录用户画像与产品目标,用 DESIGN.md 记录视觉系统与品牌规则,智能体在设计前先读取这些文件,让不同会话、不同智能体都遵循同一套约束。
官方说明 ↗Live 模式指向正在运行的应用,打开页面后等待你点选元素或整页引导,可命名元素并排对比多个变体(Freeform、Bolder、Quieter、Distill 等方向),满意的一键写入源码。
官方说明 ↗critique/audit 类命令会给界面按层级、清晰度、工艺等维度打分并输出总分(官网示例 61 of 100),按 P0 到 P3 列出优先修复项,例如给邮箱输入框补一个可见标签。
支持 npx impeccable install 一键安装,也可在 Claude Code 插件市场添加 pbakaus/impeccable,或用 npx skills add 安装共享技能;GitHub Copilot 应用内置 Impeccable,在设置里开启即可。
官方说明 ↗把检测器接进自动化流程,对拉取请求中的 UI 改动做检查,CLI 返回发现列表与退出码供构建流程判断;另有 Chrome 扩展可在 DevTools 面板查看页面上的设计问题。
日常用 Codex CLI、Claude Code、Cursor、GitHub Copilot 等工具写前端的开发者,能直接给智能体挂上这套技能,让生成与改写的页面摆脱典型 AI 审美。
已有颜色、组件与品牌规则、希望 AI 生成的页面保持一致的小团队,可用 DESIGN.md 沉淀标准,让后续功能与新的智能体会话都自动遵守。
独自维护产品、没有设计师协作的人,可以借助 critique 打分与 P0 修复清单自行迭代界面;但审美方向的最终取舍仍要自己做,效果取决于指令表达。
如果工作流要求先出高保真设计稿、多轮评审后再开发,这套代码内改进的路线并不匹配;官网也提示 mockup 优先模式视觉更保守、需要图像生成能力。
它必须在宿主编码智能体里安装并配置 hooks 才能生效,纯非技术用户没有对应的运行环境,装了也没有入口,不建议选。
免费。官网将其作为开源技能包发布,安装命令 npx impeccable install 直接公开,多条用户评价提到「不敢相信它免费」「它替代了一些付费产品还更好」。检测环节在代码里运行,也不需要 AI 模型或 API key;但 mockup 优先的工作流若要开图像生成,可能涉及你自己的编码工具或 OpenAI API key 费用。
它是一套挂在 AI 编码智能体上的前端设计技能包,不是独立应用也不是组件库。核心由三部分组成:按任务拆分的斜杠命令(创建、评估、精修、简化、加固、系统六类)、PRODUCT.md 与 DESIGN.md 两类上下文文件,以及一个在代码里运行的 AI 审美检测器。支持 Codex CLI、Claude Code、GitHub Copilot、Cursor、Gemini CLI 等多种宿主。
官网把对比直接摆在首页,有用户评价称「Impeccable > Claude design」「卸载你现在用的前端技能,换成 Impeccable」。它相当于在通用智能体外挂一层设计词汇与反模式规则,并用检测器兜住 AI 审美问题;如果你只用 Claude Code 的原生能力,这些约束与检查需要自己搭。已有 Impeccable 用户评价也提到它让产出「比 100% vibe coded 的落地页体面得多」。
它本身是开源技能包,装进本地编码工具后离线部分可用,但官网、文档与安装源都在境外,国内访问可能受网络环境影响;GitHub Copilot、ChatGPT 等宿主工具在国内使用同样存在网络与账号限制。检测器不需 API key,配置好 hooks 后的自动检查不依赖外部服务,这一点对网络受限环境相对友好。
三步:先在项目里运行 npx impeccable install(或用 Claude 插件市场、npx skills add,Copilot 应用内置可直接开启);然后运行 /impeccable init 初始化项目、/impeccable hooks on 开启自动检查,注意要在宿主工具里完成 hooks 信任审批(例如 Codex 的 Settings → Hooks);最后用 PRODUCT.md 记录用户与目标。首次配置比普通插件多一步审批,之后更新用 npx impeccable update 即可。
| 工具 | 编辑评分 | 价格 | 核心功能 | 平台 |
|---|---|---|---|---|
| Impeccable本工具 | 4.5 | 免费开源 | 按任务拆分的设计命令;AI 审美检测器;尊重既有设计系统;项目上下文文件 | Web / Chrome 扩展 / CLI |
| Tambo AI | — | 未标价 | 用于 React 前端的开源 AI 调度框架 | — |
| Straion | — | 未标价 | 为 Cursor 和 Claude 等 AI 编程助手提供集中式规则管理和计划验证 | — |
| SuperDesign | — | 未标价 | 开源的 UI 设计 AI 智能体 | — |
| Taste Skill | — | 未标价 | Taste Skill 是开源的 Agent 技能文件库,可升级 AI 构建的界面质量 | — |
| ModularMind | — | 未标价 | 无代码 AI 构建器,AI 不是魔法,而是 ModularMind | — |