Menu
UI 规范文档生成技能。生成或更新项目的视觉设计规范，包含色彩体系、字体规范、间距系统、组件规范和图标规范。适用于 UI 设计师在项目启动时建立设计规范，或在组件新增后更新规范文档。
Installer avec Codex ou Claude Copiez ce prompt, collez-le dans Codex, Claude ou un autre assistant, puis laissez-le vérifier la page du skill et l'installer pour vous.
Basé sur la classification professionnelle SOC
| name | ui-spec-gen |
| description | UI 规范文档生成技能。生成或更新项目的视觉设计规范，包含色彩体系、字体规范、间距系统、组件规范和图标规范。适用于 UI 设计师在项目启动时建立设计规范，或在组件新增后更新规范文档。 |
# UI 设计规范 — [项目名]
版本: v1.0 | 日期: YYYY-MM-DD | 负责人: UI 设计师
## 色彩体系
| 色彩类型 | 色值 | 使用场景 |
|---------|------|---------|
| 主色 | #XXXXXX | 主要按钮、链接、高亮 |
| 辅色 | #XXXXXX | 次要操作、标签 |
| 成功色 | #XXXXXX | 成功状态 |
| 警告色 | #XXXXXX | 警告状态 |
| 错误色 | #XXXXXX | 错误状态 |
| 文字主色 | #XXXXXX | 正文 |
| 文字辅色 | #XXXXXX | 次要文字、提示 |
| 背景色 | #XXXXXX | 页面背景 |
## 字体规范
| 级别 | 字号 | 字重 | 行高 | 使用场景 |
|------|------|------|------|---------|
| H1 | 24px | 600 | 1.4 | 页面标题 |
| H2 | 20px | 600 | 1.4 | 区块标题 |
| 正文 | 14px | 400 | 1.6 | 普通文本 |
| 辅助 | 12px | 400 | 1.6 | 提示、标签 |
## 间距系统
基础单位: 4px
常用间距: 4 / 8 / 12 / 16 / 24 / 32 / 48px
## 组件规范
### 按钮
| 类型 | 背景色 | 文字色 | 高度 | 圆角 |
|------|--------|--------|------|------|
| 主按钮 | 主色 | #FFF | 36px | 4px |
| 次按钮 | 透明 | 主色 | 36px | 4px |
## 图标规范
- 格式: SVG
- 标准尺寸: 16px / 24px / 32px
- 命名规范: icon-[功能描述]-[尺寸].svg
接口文档生成技能。根据代码或口述描述，生成标准格式的 RESTful API 接口文档，包含请求方法、路径、参数、响应示例、错误码等完整信息。适用于后端工程师在接口开发完成后生成接口文档。
架构评审技能。对技术方案、系统设计、重构计划进行结构化评审，输出评审意见和修改建议。适用于架构师评审后端/前端/DevOps 提交的技术方案，CTO 对重大架构决策的把关，以及团队内部技术方案 Review。
缺陷与故障分析技能。对线上 Bug、测试缺陷、系统故障进行根因分析，输出分析报告和改进建议。适用于后端工程师分析线上 Bug、DevOps 进行故障复盘、QA 输出阶段质量分析报告。
商务技术方案生成技能。将客户需求转化为对外的技术商务方案文档，包含解决方案描述、技术优势、实施计划和报价说明。适用于 CTO 对客户进行技术方案展示和商务拓展场景。
代码审查技能。对提交的代码进行结构化检查，输出评审意见。适用于后端工程师、前端工程师提交 MR 前的自检，以及互相 Review 他人代码。包含逻辑正确性、异常处理、安全性、性能、可读性等维度。
部署检查清单技能。在每次生产环境上线前，生成并执行标准化的上线检查清单，确保代码、测试、数据库、回滚方案均已就绪。适用于 DevOps 工程师执行上线操作前的标准检查流程。