Impeccable—AI UI 设计能力增强框架

Impeccable 是一个 GitHub 开源项目。使你的人工智能工具在设计上更胜一筹的设计语言。

为什么选择 Impeccable？

Anthropic 的前端设计是首个广受使用的 Claude 设计技能。Impeccable 由此起步。

每个模型都基于相同的 SaaS 模板进行训练。跳过引导，你就会在每个项目中得到相同的那几个特征：所有地方都用 Inter 字体、紫到蓝的渐变、卡片嵌套卡片、彩色背景上的灰色文字、每个标题上方都是圆角方形图标瓦片。

• 一次设置流程。/impeccable init 在 PRODUCT.md 中记录持久的产品事实，因此后续命令可以了解受众、目的、运行环境、约束条件、风格和证据，而不会将这些事实与表面视觉方向混淆。
• 24 条命令。与你的人工智能共享设计词汇：润色、审计、批评、提炼、动画化、加粗、减弱等等。
• 61 条确定性检测规则加上仅限 LLM 的批评检查。CLI 和浏览器扩展程序无需 LLM 和 API 密钥即可运行确定性规则。

包含内容

技能：impeccable

该技能安装为一条命令：

/impeccable <command> <target>

/impeccable init

init 检查项目，仅询问持久产品事实中的材料缺口，并写入 PRODUCT.md。访客模式和视觉方向稍后为每个界面选择；现有的或新构建的视觉系统单独记录在 DESIGN.md 中。

24 个命令

所有命令通过 /impeccable 访问：

命令	功能说明
/impeccable craft	完整的先构思后构建流程，含可视化迭代
/impeccable init	一次性设置：收集持久的产品上下文，编写 PRODUCT.md，在适用时配置实时模式，推荐后续步骤
/impeccable document	从现有项目代码生成根目录 DESIGN.md
/impeccable extract	将可复用组件和令牌提取到设计系统中
完美形态	编写代码前先规划 UX/UI
完美批评	UX 设计审查：层次结构、清晰度、情感共鸣
完美审查	执行技术质量检查（无障碍访问、性能、响应式）
完美打磨	最终审查、设计系统一致性检查及发布就绪状态
完美增强	增强平淡的设计
完美弱化	柔和过于大胆的设计
/impeccable distill	提炼至精华

使用 /impeccable pin 创建独立快捷方式（例如，pin audit 会创建 /audit）。

使用示例

/impeccable audit blog           # Audit blog hub + post pages
/impeccable critique landing     # UX design review
/impeccable polish settings      # Final pass before shipping
/impeccable harden checkout      # Add error handling + edge cases

或直接使用 /impeccable 加描述：

/impeccable redo this hero section

反模式

实际查看

查看 Neo Mirai 案例研究，了解使用 Impeccable 命令改造真实项目的前后对比。

安装

该 skill 无需自有运行时。每个 skill 副本都附带一个小型的启动器（scripts/impeccable，Windows 系统为 impeccable.cmd），用于运行 Impeccable 引擎——一个自包含的二进制文件，位于启动器旁边或首次运行时下载到 /.impeccable/bin/。只有在使用 npx impeccable installer（同一二进制文件的包装器）时才会用到 Node；手动安装和 Git 方式都不需要它。

方式一：CLI 安装程序（推荐）

在项目根目录下运行：

npx impeccable install

这会显示检测到的工具文件夹或已安装的 CLI（例如 /.claude、/.codex、/.grok、/.hermes、/.veto，或项目本地的 .cursor），让你保留检测到的集合或自定义 provider，然后询问是安装到当前项目还是全局。在脚本中使用 –providers=claude,codex,cursor,grok,hermes,veto 和 –scope=project|global 来跳过这些选择。在 Claude Code、Cursor、Codex、GitHub Copilot 和 Grok Build 上，它还会为当前项目安装 provider 原生的 hook 清单。Veto 接收打包后的技能到 /.veto/skills/，且不运行原生 Impeccable 编辑 hook。支持 Cursor、Claude Code、GitHub CLI、Codex CLI、Grok Build、Hermes Agent、Veto 以及所有其他受支持的工具。之后请重新加载你的工具。

要刷新现有安装，请运行：

npx impeccable update

Codex 用户应在安装或更新后打开 /hooks，并在提示时批准项目 hook。Codex 通过 hook 定义追踪信任，因此更改 .codex/hooks.json 的更新可能需要重新批准。Grok Build 用户需要在 .grok/hooks/ 脚本运行前授予项目文件夹信任（/hooks-trust 或使用 –trust 启动）。

请参阅在工具中允许 hook 获取特定于工具的信任和验证步骤。

方式二：Git Submodule

对于希望通过 Git 保持 Impeccable 供应商化并更新的团队，请将此仓库添加为子模块，并将编译后的 provider 构建链接到你的工具文件夹中：

git submodule add https://github.com/pbakaus/impeccable .impeccable
npx impeccable link --source=.impeccable --providers=claude,cursor
git add .gitmodules .impeccable .claude .cursor
git commit -m "Add Impeccable skills"

使用项目所需的 provider，例如 claude、cursor、gemini、codex、github、grok、hermes、opencode、pi、qoder、trae、trae-cn、rovo-dev、vibe 或 veto。此命令从 .impeccable/dist/universal/ 链接单独的技能文件夹，除非你传入 –force，否则不会影响现有的真实技能目录。

git submodule update --remote .impeccable
npx impeccable link --source=.impeccable --providers=claude,cursor

用法

安装后，每个命令都通过单个 /impeccable 技能运行：

/impeccable audit        # Find issues
/impeccable polish       # Final cleanup
/impeccable distill      # Remove complexity
/impeccable critique     # Full design review

单独输入 /impeccable 可查看完整命令列表。

大多数命令接受一个可选参数来聚焦于特定区域：

/impeccable audit the header
/impeccable polish the checkout form

如果你经常使用某个命令，可以用 /impeccable pin audit 将其固定为独立的快捷方式 /audit。

注意：Codex 在此使用 skills，而非 /prompts: 命令。打开 /skills 或输入 $impeccable。仓库本地安装位于 .agents/skills/；用户级安装位于 /.agents/skills/。GitHub Copilot 使用 .github/skills/。如果新安装的 skill 未出现，请重启该工具。

将 .impeccable 排除在 git 之外

当你运行命令时，Impeccable 会在 .impeccable/ 下写入工作文件：critique 和 polish 截图、live-mode 会话和预览状态、运行时缓存以及每位开发者的配置。大部分文件是临时的，不应被提交，而少数文件是共享的项目产物，应当留在仓库中。将以下代码块添加到项目的 .gitignore 中：

# impeccable-ignore-start
# Ephemeral output, runtime state, and per-dev overrides.
# Unanchored: .impeccable may sit at the repo root or under a nested
# workspace (apps/web/.impeccable/...); anchored patterns would miss it.
# Shared artifacts stay tracked: config.json, live/config.json,
# design.json, surfaces/*.md, critique/*.md.
.impeccable/config.local.json
.impeccable/hook.cache.json
.impeccable/hook.pending.json
.impeccable/*.png
.impeccable/review/
.impeccable/questions/
.impeccable/live/server.json
.impeccable/live/sessions/
.impeccable/live/previews/
.impeccable/live/annotations/
.impeccable/live/cache/
.impeccable/live/manual-edit-apply-transaction.json
.impeccable/live/manual-edit-events.jsonl
.impeccable/live/manual-edit-evidence/
.impeccable/live/pending-manual-edits.json
.impeccable/live/deferred-svelte-component-accepts.json
.impeccable/live/*.png
# impeccable-ignore-end

该代码块用 # impeccable-ignore-start / # impeccable-ignore-end 标记包裹，便于你后续识别和刷新。这些模式特意未做锚定：在大规模代码库中，活动项目（及其 .impeccable/ 目录）通常位于嵌套的工作区路径下，如 apps/web/，如果使用根目录锚定的模式则会遗漏它。

保留对这些文件的跟踪（它们是共享的项目产物，不要将它们添加到 .gitignore）：

• .impeccable/config.json（统一共享配置）
• .impeccable/live/config.json（live-mode 框架连接配置）
• .impeccable/design.json（共享设计规范）
• .impeccable/surfaces/.md（路由或产物特定的策略和方向契约）
• .impeccable/critique/.md（审查报告）

如果某个临时文件（如截图、config.local.json）在添加该代码块之前已被提交，.gitignore 不会自动取消对它的跟踪。运行 git rm –cached 可停止跟踪该文件，同时保留本地副本。

以上内容基于 GitHub 仓库 README 解析生成，适合先快速了解项目定位、安装方式、核心能力与使用边界。