color-toolkit-turn

专业颜色工具集，支持颜色编码转换、对比度计算、智能颜色推荐、HTML预览生成。适用于UI设计、无障碍开发、配色方案生成等场景。

Color Toolkit - 专业颜色工具集

核心能力

📚 渐进式加载：本技能采用渐进式 MD 体系，SKILL.md 为入口（≤230行），详细内容拆分到 references/*.md 按需加载。

渐进式文件索引

文件	说明
references/examples.md	输出格式示例
references/faq.md	常见问题
references/antipatterns.md	反模式与注意事项
references/changelog.md	更新日志

Color Toolkit 是一个通用的颜色处理工具包，提供：

• 颜色编码转换：HEX ↔ RGB ↔ HSL ↔ HSV ↔ CMYK 全支持
• 对比度计算：WCAG 2.1、APCA、CIELAB ΔE*ab、CIEDE2000 四种算法
• 智能颜色推荐：根据用户描述生成配色方案
• HTML预览生成：实时预览颜色效果

触发场景

正向触发（满足以下任意一条）：

• 用户需要颜色转换、对比度计算或配色方案

否定条件（满足以下任意一条，不触发）：

• 简单问答、闲聊、问候（不需要本技能）
• 单步任务（不需要结构化执行）

核心功能

1. 颜色编码转换

text

输入格式支持：
- HEX: #FF5733, #F53
- RGB: rgb(255, 87, 51), 255, 87, 51
- HSL: hsl(11, 100%, 60%), 11, 100, 60
- HSV: 11, 100, 60
- CMYK: 0, 66, 100, 0

输出格式：
- HEX: #FF5733
- RGB: RGB(r=255, g=87, b=51)
- HSL: HSL(h=11.0, s=100.0, l=60.0)
- HSV: HSV(h=11, s=100, v=60)
- CMYK: CMYK(c=0, m=66, y=100, k=0)

2. 对比度计算（四种算法）

算法	用途	评估标准
WCAG 2.1	无障碍标准	≥4.5:1 (AA) / ≥7:1 (AAA)
APCA	现代对比度	≥45 Lc (可读) / ≥75 Lc (优秀)
CIELAB ΔE*ab	精确色差	≤2 (不可辨) / ≤10 (微小)
CIEDE2000	专业色差	≤1 (完美) / ≤2 (接近)

3. 智能颜色推荐

输入：用户描述（中文/英文） 处理：LLM解析语义 → 提取关键词 → 映射到色彩空间 输出：

• 主色（1个）
• 辅助色（2-3个）
• 强调色（1个）
• 背景/文字色建议

4. HTML预览生成

生成的HTML包含：

• 颜色色块展示
• 渐变效果预览
• 对比度示例
• 文本可读性测试
• 无障碍合规提示

使用方式

方式一：直接对话（推荐）

text

用户：请帮我转换颜色 #3498db 到所有格式
用户：计算 #000000 和 #ffffff 的对比度
用户：推荐一套科技感的配色方案
用户：生成这个颜色的预览页面

方式二：AI 对话

直接描述需求即可，无需命令行操作。AI 会自动调用颜色转换、对比度计算等核心功能。

输出格式

颜色转换结果示例

输出格式详情 → 详见 references/examples.md

对比度计算结果示例

输出格式详情 → 详见 references/examples.md

颜色推荐结果示例

输出格式详情 → 详见 references/examples.md

技术实现

依赖

• Python 3.8+
• 仅使用标准库（math, re, random, dataclasses, typing）

文件结构

text

color-toolkit/
├── SKILL.md              # 本技能文档
└── references/           # 渐进式文档
    ├── examples.md       # 输出格式示例
    ├── faq.md            # 常见问题
    ├── antipatterns.md   # 反模式
    └── changelog.md      # 更新日志

使用限制

约束项	说明
输入范围	HEX 支持 3/6 位格式；RGB 值自动裁剪 0-255；HSL/HSV 角度 0-360
性能	颜色转换无外部依赖，毫秒级响应
环境要求	Python ≥ 3.8，仅标准库，无额外依赖

常见使用误区 → 详见 反模式

示例对话

text

用户：#FF5733 是什么颜色？
助手：
- **HEX**: #FF5733
- **RGB**: RGB(r=255, g=87, b=51)
- **HSL**: HSL(h=11, s=100%, l=60%)
- **色系**: 暖色 / 橙红系
- **亮度**: 0.384（较高）
- **预览**: [生成HTML预览]

用户：计算这个颜色和白色的对比度
助手：
- **WCAG 2.1**: 3.97:1 (大文本AA级) ⚠️
- **APCA**: 58.2 Lc (良好)
- **结论**: 小文本可能不符合AA标准，建议增加对比度

用户：给我一套春天主题的配色
助手：
- **主色**: #4CAF50 (生机绿)
- **辅助**: #E8F5E9 (浅芽绿), #FF9800 (迎春黄)
- **强调**: #E91E63 (桃花粉)
- **预览**: [生成春意盎然的HTML预览]

详见 反模式

详见 FAQ