基于 SOC 职业分类
用 Codex 或 Claude 帮你安装 复制这段 Prompt，粘贴到 Codex、Claude 或其他助手里，让它检查 Skill 页面并帮你完成安装。
直接命令不会经过审查 Prompt；运行前请先检查来源。
npx skills add https://github.com/toheart/go-react-openspec-starter --skill impeccable-design命令会保持在同一行。复制前请横向滚动并检查完整内容。
想先保存到本地？可下载 SkillsMP 当前能够提供的文件。
正在显示 SKILL.md
Ant Design B 端管理台设计规范。为使用 antd + React + TypeScript 的企业后台项目提供组件使用规范、布局模式、主题 Token 体系和高频组件最佳实践。当编写或审查前端 UI 代码时自动应用。
架构级方案评审与 Bad Path 审查。在 feature-design 的 propose 之后、 gate-design 之前由主流程执行。审查方案完整性、架构一致性、数据模型一致性、 bad path 覆盖度，产出审查报告并把错误响应契约追加到 design.md。 说"方案评审""design review""架构评审""审查方案"时触发。
在 Go/React OpenSpec 项目中把功能需求推进到可执行设计：整理 brief、调研代码、生成 OpenSpec proposal/design/tasks、产出 test-plan.md，并把设计状态与 handoff 写入共享 `.orchestrator` 目录。用于用户请求 `$feature-design change-name`、启动或恢复 feature 设计阶段、需要把模糊需求收敛为可执行 OpenSpec 设计时。
| name | impeccable-design |
| description | 框架无关的前端设计语言参考。提供排版、色彩、动效、空间构图的专业设计原则与反模式清单，避免生成千篇一律的"AI 风格"界面。当构建或优化 UI 界面时使用。 |
框架无关的设计语言参考，源自 Impeccable 和 UI Design Brain 的核心精华，适配 B 端管理台场景。
本 Skill 提供"设计原则"，具体到 antd 组件如何落地请参考
antd-design-systemSkill。
line-height: 1.5（14px × 1.5 = 21px），间距取其倍数保持节奏感font-variant-numeric: tabular-nums 保证列对齐#4f46e5 用于交互元素，大面积使用中性灰白#808080，用带微蓝倾向的 slate 系列（#64748b / #94a3b8）rgba(0,0,0,0.85) 替代 #000，用 #f5f5f5/#fafafa 替代 #fffease-out（快进慢出），避免 bounce/elastic（过时）prefers-reduced-motion: reduce 时关闭非必要动效| 场景 | 效果 | 时长 |
|---|---|---|
| 按钮 hover | 微弱背景色变化 | 150ms |
| Modal 弹出 | fade + scale(0.95→1) | 200ms |
| Drawer 滑入 | translateX 从右侧滑入 | 250ms |
| 表格行展开 | 高度过渡 | 200ms |
| 页面切换 | fade-in | 200ms |
transition: all 0.3s（性能杀手，对所有属性生效）每个界面都要考虑完整的状态矩阵：
| 状态 | 处理方式 |
|---|---|
| 空状态 | 插图 + 描述文案 + 主操作按钮，正面引导语气 |
| 加载中 | 列表/卡片用 Skeleton 占位（模拟真实布局形状）；页面级用 Spin |
| 错误 | 内联错误提示，失焦时校验；网络错误用全局 notification |
| 禁用 | 视觉灰化但仍可读，Tooltip 说明禁用原因 |
| 成功 | 短暂 message 反馈（3s），不阻断操作流 |
生成 UI 后做自检——如果有人说"这一看就是 AI 做的"，那就有问题：