项目介绍
Impeccable 是面向 AI 编码 Agent 的前端设计 Skill,把产品上下文、视觉方向、界面审查、定向打磨、实时浏览器迭代和机械检测组织成一套连续工作流。当前公开版本包含 23 个命令和 61 条确定性检测规则;本页基于固定 GitHub 提交与公开发布记录整理,没有把项目自述写成亲自实测。
核心功能
上下文与视觉方向
通过 init、document、teach 和 shape 等流程形成 PRODUCT.md、DESIGN.md 与具体页面策略,减少脱离产品事实的界面生成。
界面审查与打磨
提供 critique、audit、polish、distill、clarify、bolder 和 quieter 等命令,分别处理视觉、无障碍、响应式、文案与复杂度问题。
实时浏览器迭代
Live 模式通过本地开发服务器和浏览器探索视觉方向、注释页面并把选定变体落回本地源代码。
机械反模式检测
CLI、浏览器扩展和本地 Hook 共用 61 条确定性规则,无需 LLM 或 API Key;可输出适合 CI 的 JSON。
安装与使用
在项目根目录运行 `npx impeccable install`,选择检测到的 Agent 和项目或全局范围;进入 Agent 后运行 `/impeccable init`,Codex 还需打开 `/hooks` 批准项目 Hook。
让 AI Agent 帮你安装
把这段话发送给 Codex、Claude Code 或其他可以操作本地环境的 AI Agent。
请帮我在当前项目安装 Impeccable,项目地址:https://github.com/pbakaus/impeccable。先阅读固定提交 36e4cea 的 README.md、package.json、.agents/skills/impeccable/SKILL.md 和 .codex/hooks.json,说明将写入的 Skill、Hook 与 .impeccable 路径,以及首次引擎下载。确认 Node.js 至少为 22.18.0 后运行 `npx impeccable install`。不要使用 --force,也不要覆盖已有同名 Skill 或损坏的 Hook 清单;需要启用 Hook 时先展示其命令。Codex 安装后提醒我打开 /hooks 批准。最后运行 /impeccable init,并对非敏感测试页面执行一次 /impeccable audit;不要修改生产页面或启动 Live 模式,除非我另行确认。- Node.js 22.18.0 或更高版本,仅 npx 安装器需要
- 一个受支持的 AI 编码 Agent
- 对目标项目 Skill、Hook 和配置目录的写权限
- 允许首次从 GitHub Release 获取并校验固定版本引擎
npx impeccable install- 1核对环境与写入范围
确认 Node.js 版本、目标 Agent、项目或全局安装范围,并查看将创建或合并的 Skill 和 Hook 文件。
- 2执行官方安装
在项目根目录运行: npx impeccable install
- 3批准 Hook 并初始化
Codex 用户打开 /hooks 审查并批准项目 Hook,然后在 Agent 中运行 /impeccable init,确认 PRODUCT.md 和相关配置符合项目事实。
- 4运行最小审查
选取一个非敏感测试页面运行 /impeccable audit,确认输出包含优先级、受影响文件或选择器及具体改进建议,再决定是否进入 polish 或 live。
安装后确认宿主能发现 Impeccable Skill,运行 `/impeccable init` 生成或确认 PRODUCT.md;再对一个非敏感测试页面运行 `/impeccable audit`,确认得到带文件或选择器证据的优先级问题清单。Codex 用户同时确认 /hooks 已批准。
- 交互安装默认建议启用 Hook,可用 --no-hooks 为本次安装跳过
- Codex 对 Hook 的批准不能由安装器代替
- 对陌生项目启用 Live 模式前,应先审查 package.json 中的 impeccable:manual-edit-validate 脚本
使用场景
新界面定向
先固定产品事实和视觉世界,再由 Agent 生成并实现符合项目语境的新页面。
现有页面审查
把视觉层级、响应式、无障碍和性能问题整理为带证据的修复清单。
编辑后质量门
利用宿主原生 Hook 对变更文件运行确定性规则,在 Agent 流程中反馈常见反模式。
使用评价
Impeccable 的特点是把设计上下文、工作流指令、浏览器反馈和可重复的机械规则放在同一条前端交付链路中。它的 Hook 与 CLI 对早期发现常见问题有帮助,但机械检测不能替代人工视觉和无障碍评审;本评价仅基于公开代码与文档。
值得一试的地方
- 23 个命令覆盖从产品上下文到审查、打磨和视觉方向调整的连续流程。
- 61 条规则无需 LLM 或 API Key,可通过 Hook、CLI 和 CI 重复执行。
- 支持多种编码 Agent,并为 Codex、Claude Code、Cursor 等提供宿主原生 Hook。
使用前要知道
- 检测通过不代表界面整体质量、可用性或无障碍已经达标。
- Hook 会执行本地二进制并读取变更文件,需要用户审查和宿主信任。
- 本页没有实测安装、Hook、Live 模式或真实前端任务。
README
Impeccable
Overview
面向 AI 编码 Agent 的前端设计 Skill,提供 23 个界面工作流、实时浏览器迭代和 61 条确定性检测规则,并可通过本地 Hook 在编辑后反馈问题。 Design guidance for AI coding agents. 1 skill, 23 commands, live browser iteration, and 61 deterministic detector rules for AI-generated frontend design.
Getting started
- 在项目根目录运行 `npx impeccable install`,选择检测到的 Agent 和项目或全局范围;进入 Agent 后运行 `/impeccable init`,Codex 还需打开 `/hooks` 批准项目 Hook。
- 项目定位:为 AI 编码 Agent 提供前端设计指导、23 个工作流、实时浏览器迭代和 61 条确定性规则。
- 初始化:/impeccable init 检查项目并写入 PRODUCT.md,既有或新设计系统另行记录在 DESIGN.md。
- 安装后确认宿主能发现 Impeccable Skill,运行 `/impeccable init` 生成或确认 PRODUCT.md;再对一个非敏感测试页面运行 `/impeccable audit`,确认得到带文件或选择器证据的优先级问题清单。Codex 用户同时确认 /hooks 已批准。
Configuration
npx impeccable install在 GitHub 阅读完整 README →