用途：针对过灰、单色或缺少视觉温度与个性的 React/Web UI 设计，有计划地引入颜色，建立语义色、层次与色彩体系。
主要能力：评估当前配色状态（是否纯灰、缺少强调色、中性色温度）；识别颜色可发挥价值的场景，如语义状态（成功绿、错误红、警告橙黄、信息蓝）、层次强调、分类、情绪基调、导航引导与细节趣味；规划调色板（中性色外最多 2-4 种颜色）与 60/30/10 主次分配；构建中性色阶、主色与强调色阶（建议 5-10 个色阶）、饱和度与明度控制、对比度策略；并落实到语义色、强调色、背景与表面、数据可视化、边框、文字颜色与装饰元素。
使用方式：文中要求先阅读 frontend-design 并遵循其 Context Gathering Protocol，复用已有上下文，只就关键缺口提问，并收集现有品牌色。需要时查阅 color and contrast、color ramp workflow、semantic color 等参考。实现建议用 OKLCH，但概念上仍按色相、饱和度、明度思考。
限制与注意：颜色越多不等于越好，每个颜色都应有目的，需强化已有层次而非替代它。禁止使用彩虹配色、无意义地随机上色、在彩色背景上用灰色文字、临时用 lighten/darken 拼凑色阶、仅因偏好替换既有中性/黑白 token、违反 WCAG 对比度、把颜色作为唯一指示、默认紫蓝渐变。需保证文本 4.5:1、UI 组件 3:1 对比度，并进行色盲测试。原文未提供安装命令与具体代码示例。