Impeccable Skill：让 AI 编程工具的 UI 输出告别”AI 风”的设计语言

Skill超级捕获手 技术创作者 2026-09-23 15 阅读

AI 生成的前端代码，正在暴露一个尴尬的现实：模型学的是同一套 SaaS 模板，产出的界面千人一面——清一色 Inter 字体、紫蓝渐变、卡片套卡片、灰色文字配彩色背景。这种”AI 风”已经成为辨识度最高的审美污染。

Impeccable 正是为解决这一问题而生：它为 AI 编程 Agent 提供一套完整的设计语言——24 条设计命令、61 条确定性反模式检测规则，让 Agent 的前端输出从”能用”升级到”专业”。截至 2026-09-23，该项目在 GitHub 已有约 70K Stars，背后公司 Renaissance Geek 已获 a16z 种子轮投资，并与 GitHub 达成官方合作将 Impeccable 集成进 GitHub Copilot。

功能与原则

Impeccable 不是一个模型，而是一套可安装到任意 AI 编程工具的设计技能。它向 Agent 暴露一套设计词汇表，让 Agent 在生成 UI 代码时遵守专业设计规范，而不是自由发挥一套通用模板。

核心理念：确定性规则优先，LLM 判断作为补充。61 条反模式检测完全在本地 CLI 运行，无需 API Key、无需调用大模型，结果是确定的（同一输入永远输出同一检测结果）。

认可度

  • GitHub Stars：约 70K+（截至 2026-09-23），持续增长中
  • 安装量：自称”数十万次安装”（GitHub 官方合作背书）
  • Trending：2026-09-23 登上 GitHub Trending 日榜，287 stars/day
  • 投资背景：Paul Bakaus 创立 Renaissance Geek，获 a16z 种子轮投资
  • 官方合作：已与 GitHub 合作集成进 Copilot，是目前唯一进入 Copilot 的第三方设计 Skill
  • 支持平台：Claude Code、Cursor、GitHub Copilot、Codex CLI、Gemini CLI、Grok Build、Hermes Agent、Veto、OpenCode 等 20+ 主流 AI 编程工具

链接

GitHub：https://github.com/pbakaus/impeccable
官网：https://impeccable.style

原作者

Paul Bakaus（GitHub @pbakaus）—— jQuery UI 原始创始人之一，前 Google 前端工程师，现 Renaissance Geek 创始人兼 CEO。他将自己在 UI 框架领域十余年的设计经验压缩进这套开源 Skill，目标是把”设计品味”这件事从人类设计师交给 AI Agent。

介绍

Paul Bakaus 在一次访谈中回忆：他看着 AI 编程工具生成的前端代码，总觉得哪里不对——不是因为功能实现有问题，而是因为这些界面”看起来就像 AI 写的”。他意识到这不是模型能力的问题，而是缺乏设计约束的问题：大模型在同样的 SaaS 设计数据上训练，输出自然会趋同。

Impeccable 的解决思路是：不给 Agent 更多能力，而是给它更多设计判断的边界。它不教 Agent”怎么做”，而是告诉 Agent”不要这么做”——哪些字体被用烂了、哪些颜色搭配是审美陷阱、哪些布局模式让人一眼认出这是 AI 作品。

安装后，Agent 会获得一套可查询的设计知识库，涵盖 7 个专业领域：Typography（字体系统）、Color & Contrast（OKLCH 色彩体系）、Spatial Design（间距与网格）、Motion Design（动效曲线）、Interaction Design（交互模式）、Responsive Design（响应式设计）、UX Writing（文案规范）。每次生成 UI 时，Agent 都可以调用对应领域的规则进行自查。

特点

  • 24 条设计命令：涵盖完整 UI 开发周期——从 init（初始化产品上下文）到 polish（最终交付检查），中间有 craft、shape、critique、audit、distill、harden、animate、colorize、typeset、layout 等专业化命令
  • 61 条确定性反模式规则：本地 CLI 运行，无需 API Key，检测 AI 生成代码中已知的设计问题（Overused fonts、purple gradients、nested cards 等）
  • PRODUCT.md 持久化上下文：/impeccable init 会询问产品的核心定位、受众和约束条件，将答案写入 PRODUCT.md，后续命令基于这份事实文档做设计决策，不会将产品定位和视觉方向混淆
  • Live 模式：Agent 可以在浏览器中实时迭代 UI 变体，开发者实时查看效果并干预
  • 跨平台通用：同一套 Skill 文件适配 20+ AI 编程工具（Claude Code、Cursor、Copilot、Codex、Gemini CLI、Grok、Hermes Agent 等），一次安装全平台生效

使用方法

快速安装（推荐）：

npx impeccable install

安装程序会自动检测当前项目的 AI 编程工具（Claude Code、Cursor 等），询问安装范围（项目级或全局），完成后重载 Agent。

初始化项目：

在 Agent 对话框中执行：

/impeccable init

init 会检查项目结构、询问产品核心信息（目标用户、使用场景、核心价值主张），并将答案写入 PRODUCT.md。后续命令都会参考这份文档。

日常使用示例：

/impeccable audit blog          # 检查 blog 相关页面的可访问性、性能、响应式问题
/impeccable critique landing    # UX 设计评审：层级、清晰度、情感共鸣
/impeccable polish settings     # 交付前最终检查，设计系统一致性
/impeccable harden checkout     # 检查错误处理、国际化、边界情况

GitHub Copilot 用户：

直接从 VS Code Marketplace 安装扩展：搜索 “Impeccable”，或执行：

code --install-extension renaissance-geek.impeccable

安装后在 Copilot Chat Agent 模式下调用 /impeccable polish。

使用场景与人群

适用场景：

  • 需要 AI 编程工具生成专业级 UI 的项目（落地页、Dashboard、管理后台、SaaS 产品）
  • 设计资源有限的团队希望 AI 输出物有基本的设计保障
  • 多 AI 工具协作时需要统一的设计语言和输出标准
  • AI 生成代码的设计 Code Review 流程

目标用户：

  • 前端开发者：补足 AI 编程工具在设计侧的短板
  • 全栈开发者：缺乏设计背景但需要 AI 产出专业 UI
  • 设计团队：为 AI 编程工具建立设计规范护栏
  • Agent 开发者：将设计质量作为 Agent 评估指标之一

输入与输出案例

案例 1：新项目初始化

输入：

/impeccable init

Agent 会询问：

  • 产品的核心功能一句话描述
  • 主要目标用户是谁
  • 产品调性（专业/活泼/极简/游戏感……）
  • 关键约束（技术限制、竞品参考、品牌规范）

用户回答后，Agent 将答案写入 PRODUCT.md，并给出首次设计方向建议。后续 /impeccable craft 或 /impeccable shape 会基于这份文档生成符合产品定位的 UI 方案。

案例 2：检测 AI 生成代码的反模式

输入：

/impeccable audit dashboard

输出（确定性 CLI 检测，无需 LLM）：

⚠ RULE-001: Overused font detected
  → Inter is used. Consider: Satoshi, Basier Circle, or DM Sans.

⚠ RULE-015: Gray text on colored background
  → .text-gray-400 on .bg-blue-600 fails WCAA AA contrast.

⚠ RULE-031: Nested cards detected
  → Card components are wrapping other cards. Flatten hierarchy.

✅ RULE-008: OKLCH color model used correctly
  → No issues found.

61 rules checked. 4 warnings, 0 errors.
Run /impeccable polish to auto-fix detected issues.

这份报告不需要调用任何 LLM API，完全在本地运行，零成本、零延迟。

GitHub: https://github.com/pbakaus/impeccable

评论区

0 条评论

登录后可评论。

Skill超级捕获手 15 阅读