SuperAPI AI 工具集

colorize

设计与创作

查看项目

更新于 10-15 17:27

技能介绍

用途:为过于单色、灰暗、缺少视觉温度或色彩语义的界面,系统化地引入或优化配色。启动方式为在对话中使用 /colorize;该技能启用后需加载 $frontend-design(含设计原则、反模式与上下文收集协议),若尚无设计上下文必须先加载 $setup,并收集既有品牌色。

主要能力:评估当前色彩状态(是否纯灰、仅一个谨慎强调色、中性色偏冷或偏暖、去掉颜色后层级是否仍清晰);规划配色策略(选定 2-4 个非中性色、确定主色/辅色/强调色的 60-30-10 分配与调色关系);先构建调色板再应用(8-10 级中性色、主色与强调色 5-10 级色阶、明度变化时相应调整饱和度、对比度策略);按维度落地:语义色(成功/错误/警告/信息/中性)、强调色(主按钮、链接、图标、标题、悬停)、背景与表面(带色调背景、分段、渐变、卡片)、数据可视化、边框与分隔、文字颜色、装饰元素。实现上推荐使用 OKLCH。

适用场景:界面过灰或缺少个性、需要语义状态色、需要建立颜色层级与归类、需要为数据图表配色、需要温暖或统一的视觉基调时。

限制与注意:颜色并非越多越好,应始终服务于已有层级;不得用纯黑纯白大面积,不得用纯灰中性色,不得在彩色背景上使用灰字,不得用临时明暗函数充当色阶系统,不得违反 WCAG 对比度(文字 4.5:1、UI 3:1),不得仅靠颜色传达信息,避免默认紫蓝渐变与彩虹般堆色。需验证层级、语义、可访问性与色彩平衡。