如果你想用AI智能体来做设计，这些技能非常棒：

• impeccable http://impeccable.style
• taste http://tasteskill.dev
• layers http://layers.jamiemill.com
• superdesign http://app.superdesign.dev

我还基于 Refactoring UI（用于打磨）做了一个插件：http://github.com/gnurio/refactoring-ui-plugin … 更多资源在这里：http://prodmgmt.world/resources

Impeccable：为AI工具集打造的设计技能

来源：https://impeccable.style/

v3.0 以来的亮点

2026年4月10日 – 5月13日

• Live 模式默认保留品牌身份。 变体在现有页面风格下保持品牌调性，并在该身份内探索不同的表达维度。只有当 PRODUCT.md 中的反引用明确拒绝当前页面，或者用户主动要求时，才会脱离当前美学方向。脱离方向源自品牌语调，而非固定目录。
• 检测器标记新的同质化趋势。 过度使用字体规则现在能捕获 Fraunces、Geist、Mona Sans、Plus Jakarta Sans、Space Grotesk、Recoleta 和 Instrument Sans。对比度检查也会对样式化的 <a> 和 <button> 元素进行。Vercel、Next.js 和 GitHub 在自己域名下享有品牌豁免。
• Live 模式在任何环境下都能工作。 严格 CSP 应用、模态宿主（Radix、Headless UI、vaul）、React/TSX 项目以及大量相同 class 的兄弟元素，都能通过 wrap → preview → accept → carbonize 循环干净处理。
• PRODUCT.md + DESIGN.md 作为共享上下文。 一个策略文件（谁、什么、为什么）和一个视觉文件（颜色、排版、以 Google Stitch 格式编写的组件，详见 https://stitch.withgoogle.com/docs/design-md/format/），每条命令在生成前都会读取它们。通过 /impeccable teach 和 /impeccable document 创建。
• 18 个技能合并为 1 个技能，包含 23 条命令。 菜单中只保留一个 /impeccable 入口，共享设计词汇表，通过 /impeccable pin 可将常用命令提升为独立快捷方式。

完整版本历史：

• /impeccable critique 在 Windows 上可用了。 critique-storage.mjs 中的 CLI 入口点检查曾将 import.meta.url 与手动构建的 file:// 字符串进行比较，这在 Windows 上静默失败（因为 Node 在 import.meta.url 中返回正斜杠，但在 process.argv[1] 中返回反斜杠）。脚本退出码为 0 且无输出，导致快照保存被跳过。现已切换到跨平台的标准模式 pathToFileURL。由 @Genmutant (https://github.com/Genmutant) 在 #155 (https://github.com/pbakaus/impeccable/issues/155) 中报告，并提供了路径不匹配的精准对比诊断。
• Codex 资产生成智能体。 一个原生 Codex 子智能体，能从已批准的 Impeccable 模拟参考中生成干净、可复用的光栅资产，而不重新设计方向。保留轮廓、调色板、光照和材质；剥离应归 CSS 控制的内嵌 UI 文本和演示装饰。仅限 Codex，因为 Codex 是目前拥有原生图像生成的工具集。已准备好跨编译管线（skill/agents/ → Codex TOML 或 Claude Markdown）以供未来智能体使用。
• 评审结果持久化。 每次 /impeccable critique 运行都会将每个目标的快照写入 .impeccable/critique/__目标名.md，包含得分、P0/P1 数量和完整报告。当对同一目标调用 /impeccable polish 时，它会读取最新匹配的快照作为额外信号，避免重复推导积压内容。同一路径下的 ignore.md 由用户管理；其中的行是设计师有意为之的偏差，评审不再重复提出。
• 提取了 Codex 专用图像流程。 mock-and-palette 工作流驻留在 reference/codex.md 中，采用 palette-first 门控（先锁定调色板再生成模拟图，防止生成的合成图偏离方向）。Craft.md 对于所有非 Codex 工具集更简短清晰，而 Codex 则在其实际能力范围内获得更精确、更密集的指导。
• 检测器：新规则 + 误报修复。 body-text-viewport-edge 捕获正文文本紧贴视口边缘（现有 29 条确定性规则）。OKLCH 和 CSS 变量解析的改进消除了现代基于 token 代码库中的一类误报。锚点继承修复阻止了将链接文本从样式化父元素继承的颜色错误标记。
• 品牌注册表更精准。 现在有一个“反向测试”问题放在最前面：用竞争对手描述他们页面的方式来描述你的页面；如果该描述同样适用于该分类中的通用落地页，则重新开始。文化符号调色板护栏可阻止偷懒的做法（略过明显颜色，转而让排版和图像承载文化含义）。
• 形状和工艺门控加强。 图像生成跳过将在一行内说明（静默跳过让 GPT 5.5 悄悄省略图像工作）。简要确认现在明确显示，而非假设。当工具集拥有原生图像生成时，craft 现在会明确命名从 shape 到 code 之间的四个用户门控（方向问题、调色板生成、模拟图生成、模拟图批准），每个门控都有明确的 STOP 标记，防止紧凑的 shape 中的“确认或覆盖”被误读为代码就绪。
• 技能文案、图像纪律和检测器数量保持真实。 技能侧的文案验证器可捕获参考指令中的破折号和最糟糕的 AI 用语。Craft 步骤 3 在截图后将其读回上下文（截图不等于检查）。构建验证器现在忽略变更日志历史中的检测器数量，因此旧的“28 条规则”引用不会与当前总数产生误报。
• 检测器标记斜体衬线展示标题。 大型斜体衬线字体（Fraunces、Recoleta、Newsreader、Playfair、Cormorant、Tiempos）作为主英雄区 h1 时，现在会被捕获为 2025 年末和 2026 年初 AI 生成营销页面的一种结构性特征。编辑部或杂志类页面若合理使用该模式，可忽略此规则。由 @vinaypokharkar (https://github.com/vinaypokharkar) 在 #129 (https://github.com/pbakaus/impeccable/pull/129) 中贡献。
• 检测器标记英雄区眉毛标签。 位于英雄区 h1 正上方的大写字母间距标签现在会被触发，包括药丸芯片变体（背景 + 999px border-radius）。仅限于小尺寸短标签，避免编辑性说明和普通副标题误报。同样由 @vinaypokharkar (https://github.com/vinaypokharkar) 在 #129 中贡献。
• Live 模式能在断连后存活。 一个持久的会话日志记录每个事件，因此智能体崩溃、网络闪断或浏览器刷新不再丢失会话。新增三个子命令：live status 报告当前状态，live resume 在中断后恢复，live complete 完成一个手动批准的变体。确认、轮询回复和回退恢复都通过日志进行。由 @nqh-packages (https://github.com/nqh-packages) 在 #125 (https://github.com/pbakaus/impeccable/pull/125) 中贡献。
• 参考文件去除了重复的模板化内容。 SKILL.md 和 33 个子命令文件移除了“记住：”结尾口号，12 个老命令中的宣传式“[动词] [对象] 以 [结果]”开头，以及 419 个破折号（这些破折号模糊了冒号、分号、句点或括号的选择）。保留下来的结尾将任务交给 /impeccable polish 而不是重复规则。每次命令加载的上下文更少，模型需要读过的重复内容也更少。
• Live 模式默认保留品牌身份。 变体现在默认保持现有页面风格（同样的调色板、同样的字体搭配、同样的视觉修辞），并在该身份内探索不同的表达维度。只有当 PRODUCT.md 中的反引用明确拒绝现有页面，或者用户主动要求时，才会脱离现有美学方向。
• 脱离方向源自品牌语调，而非固定目录。 旧的通道列表（瑞士网格、终端、工业标牌等）导致模型每次都收敛到相同的三个方向。已替换为品牌语调推导过程：读取个性词汇、想象物理体验、推导视觉方向。每次运行都会生成针对特定品牌的方向。
• 参数一致地应用于大型页面区域。 规划参数现在是变体规划的一部分，而不是单独步骤。自由形式偏差与预算表对齐：英雄区和节段每个变体 2-3 个旋钮，零参数英雄区被标记为错误而非判断选择。
• 反射式拒绝美学通道。 与 brand.md 中的字体反射拒绝列表并行。编辑型排版是第一条，捕获二阶训练反射：当 SaaS 默认美学被抛弃时，自动转向杂志封面风格。
• 双重高度分类反射检查。 共享设计法则现在同时捕获一阶反射（仅根据分类选择主题 + 调色板）和二阶反射（根据分类 + 反引用选择美学家族）。
• 对比度检查现在对样式化按钮生效。 样式化的 <a> 或 <button> 带有自身不透明背景时，曾因对比度规则而静默跳过，导致深色文本在近黑色背景上被误判为正常。现在，带有自身背景和直接文本的按钮会与其他文本元素一样经过相同的对比度和调色板检查。段落内的内联链接则继续跳过（与之前一致）。
• 弹出扫描在页面重载后不再挂起。 工具栏图标流程首次使用正常，但如果页面在中间重载，再次点击会卡在“扫描中…”。服务工作线程仅在 DevTools 打开时清除其注入的内容脚本标志，因此仅弹出路径看到过时标志，静默地将扫描请求发送到内容脚本已被清除的标签页。现在重置是无条件的；自动重新扫描仍限于 DevTools。
• 检测器标记新的同质化趋势。 过度使用字体规则现在能捕获 Fraunces、Geist、Mona Sans、Plus Jakarta Sans、Space Grotesk、Recoleta 和 Instrument Sans，以及 Inter 和旧的默认字体。Vercel、Next.js 和 GitHub 在自己域名下享有品牌豁免。
• 新规则：body-text-viewport-edge。 捕获正文文本紧贴视口边缘且无水平内边距的情况（一种结构性 AI 特征，模型跳过了布局，让所有内容紧贴窗口）。确定性规则数量至此达到 29 条。
• OKLCH 和 CSS 变量解析。 对比度和颜色规则现在能解析 oklch(...) 和 var(--token) 引用，在评估前通过级联解析。Tailwind v4 / shadcn / 基于 token 的代码库中的一类误报已消失；之前解析器遇到现代语法直接放弃，报告无结果或错误结果。
• 锚点继承修复。 对比度规则曾错误判断 <a> 颜色，当链接从样式化父元素（例如非默认文本颜色的英雄区）继承颜色时，会将真实文本标记为与自身对比度不足。现在解析能正确遍历继承链。
• Live 截图覆盖层在加载时不再闪烁纯黑色。 没有显式页面背景的页面会在截图加载前用纯墨色绘制覆盖层一帧。现在覆盖层以透明开始，在位图就绪后解析。
• 检测器可在 Windows 上运行。 CLI 路径解析曾使用 new URL(...).pathname，这会在盘符前添加斜杠（/C:/...），导致 Windows 下 fs 报错。现已全面切换到 fileURLToPath。在 #95 (https://github.com/pbakaus/impeccable/issues/95) 中报告，由 @voidborne-d (https://github.com/voidborne-d) 贡献。
• Border-radius 检测在 jsdom 下不再闪烁。 药丸按钮规则曾因 jsdom 返回不带显式宽度的百分比 radius 而遗漏真实案例；同时，当 CSS 简写未设置单独角时过度报告。现在读取器能保留百分比信号，并在浏览器和 jsdom 路径上一致解析简写，使 CLI 扫描与 live 覆盖层看到的结果一致。
• Live 模式在 Vite/Next React/TSX 项目上能生成有效的 TSX，通过 wrap → preview → accept → carbonize 循环。 包装器现在只保留一个 JSX-slot 子元素，而非三个相邻兄弟，这样在 return (...)、数组 .map(...) 和像 Radix <Slot> 这样的 asChild 父组件中都能干净往返。Carbonize 在 TSX 目标上不再在嵌套模板字面量中双倍包装 CSS；accept 和 discard 在原始缩进位置恢复所选元素（保留行间相对深度）；截图覆盖层在默认背景页面上不再闪烁黑色。关闭 #114 (https://github.com/pbakaus/impeccable/issues/114)，再次感谢 @dergachoff (https://github.com/dergachoff) 提供详细错误报告。
• Wrap 正确消歧重复的相同 class 兄弟元素。 一个 <div> 列表用相同 class 渲染三次时，曾无论用户选择哪个都落在第一个上。live-wrap.mjs 现在接受 --text TEXT（所选元素的 textContent）并据此缩小候选范围；当文本太短或未在源码中逐字出现（如子元素包含插值如 {title}）时回退到第一个匹配；当多个分支仍然匹配相等时，报错 element_ambiguous。
• live-inject CSP-meta 解包现在字节级保留自闭合标签的空白。 在 <meta> 标签上的 patch+revert 循环曾因标记插入路径中的双空格伪影而吃掉 /> 前的空格；常见的 Vite 形状（携带 CSP meta）现在能干净往返。
• live.md 规范增加了对三个实际编写陷阱的明确指导。 变体 CSS 必须使用后代组合符（:scope > .card，而非裸 :scope），否则会落在包装器上而非所选元素上。JSX <style> 正文需要 {\…`}模板字面量包装。中止进行中的会话应使用live-poll –reply EVENT_ID error “msg”，而非 live-accept –discard`；后者只会改变源码，而状态栏会永久卡在 GENERATING 圆点上。
• /impeccable craft 现在将已批准的模拟图视为视觉契约。 Craft 流程要求在 build 前进行模拟图保真度清单，将主要可见成分映射到代码或资产，并将缺少英雄对象、图像、章节结构、导航/CTA 处理以及特色图案标记为阻碍性缺陷，除非用户接受了偏离。
• 图像主导的品牌页面不再降级为抽象面板。 旅游、编辑、作品集、场地、产品展示、娱乐和教育类工作现在需要可信的图像、生成的图版、插图、地图、渲染图或目的地场景，当已批准的模拟图或主题要求时。
• /impeccable craft 和 /impeccable shape 针对自治智能体加强了安全。 Codex 类工具集曾开始先于用户确认设计简报就写入文件，将自己的摘要当作简报。设置现在提供预检清单（上下文、产品、命令参考、shape、图像门控、变异），craft 强制执行显式的构建门控：shape=pass 仅在用户单独批准简报或提供预确认简报时才有效。自己编写的简报和“反正实现会是语义化的”不再跳过视觉探测。
• Live 选择器与模态宿主良好交互。 在 Radix Dialog、Headless UI、vaul 以及其他锁定 body { pointer-events: none } 或附加外部点击关闭处理的 portal 中，选择器界面曾变得不可点击，任何点击都会关闭宿主对话框。状态栏、选择器、参数面板、注释覆盖层和设计面板现在在界面边界屏蔽外部处理，并强制自身 pointer-events: auto。主题检测也不再错误地将透明 body 读作黑色。关闭 #113 (https://github.com/pbakaus/impeccable/issues/113)，感谢 @dergachoff (https://github.com/dergachoff)