AI 辅助设计
使用 Impeccable 让 AI 编码助手持久记住你的项目视觉风格
Impeccable 是一个开源 AI 技能，为 AI 编码助手提供专业的设计词汇。没有它，AI 生成的界面往往看起来千篇一律；有了它，生成的代码会更有设计感、更统一，因为 AI 理解了你项目的字体、颜色、间距和组件规范。
支持 Claude Code、Cursor、GitHub Copilot、Gemini CLI 以及大多数 AI 编码工具。
安装
npx skills add pbakaus/impeccable这会将 Impeccable 技能安装到你项目的 .claude/skills/（或对应目录）中。
一次性初始化
运行 /teach-impeccable 一次，保存项目的设计上下文：
- 打开 AI 助手
- 输入
/teach-impeccable - 回答关于品牌颜色、字体、间距和视觉风格的问题
- 技能会将设计指南保存到 Agent 配置文件中
这个配置在后续所有会话中持续生效——只在设计方向发生较大变化时才需要重新运行。
设计命令
Impeccable 提供 20+ 个设计专用斜杠命令：
| 命令 | 用途 |
|---|---|
/polish | 精修和改进现有 UI 组件 |
/audit | 审查组件或页面的设计问题 |
/typeset | 优化排版——层级、字号、间距 |
/overdrive | 进一步强化设计——更大胆、更有辨识度 |
/critique | 基于 Nielsen 可用性启发法为设计质量打分 |
构建营销页面
初始化完成后，直接使用 Impeccable 命令构建或修改着陆页区块。AI 会读取你保存的设计指南，生成风格统一、有设计感的 UI。
着陆页组件位于 apps/launchsaas/src/components/landing/。完整组件列表见
自定义指南。
示例提示词：
为着陆页创建一个新的用户推荐（testimonials）区块。
文件在 apps/launchsaas/src/components/landing/。
与现有设计系统保持一致。重新设计 Hero 区块以突出 AI 功能。
在保持品牌一致性的同时，做出视觉差异化。/audit apps/launchsaas/src/components/landing/pricing.tsx 的定价区块/polish 功能卡片——改善间距、排版和视觉层次。资源
- Impeccable — 官网与文档
- LaunchSaaS 自定义指南 — 主题、品牌和着陆页组件