配色方案生成器
将以下提示词粘贴到你的 AI 对话框中:
请根据 https://skillhub.cn/install/skillhub.md 的安装指南,将 @user_af163eaa/z-color-palette 安装到我的 AI 助手(支持 WorkBuddy、Claude、Cursor 等客户端)。
技能介绍
它解决什么问题
对着空白画布纠结"科技感到底用哪种蓝"?或者改了十版配色,客户只回复一句"感觉不对"?配色方案生成器 做的事情很直接:把你嘴里说不出来的调性——科技、温柔、奢华、清新——翻译成一组能直接写进 CSS 的 #hex 值,而不是丢给你一串形容词。
核心能力与工作流程
它内置一套规则化的配色方法论,按五个步骤执行:
- 收集调性:确认行业、情绪、受众,以及是否已有品牌色需要衔接
- 选择配色法:在单色、近似、互补、三角、分裂互补之间做选择
- 生成色板:输出主色 + 辅助色 + 点缀色,全部以
hex呈现 - 标注冷暖与对比度:给出冷暖倾向说明,并附无障碍可读性提示
- 给出适用场景:说明这组色适合放在什么位置
底层常识包括色相 / 饱和度 / 明度的基础关系、冷暖归属(蓝绿偏冷、红橙偏暖)以及常见行业的用色习惯(科技蓝、环保绿、母婴粉等)。这些是生成时的参考框架,具体数值以实际使用为准。
输出格式与边界
输出统一为表格:角色 | 颜色名 | HEX | 用途,并附带配色法和对比度提示。
注意两点:屏幕色与印刷色存在差异,如果要印到纸上,需要自行转 CMYK 或专色,别拿屏幕色值直接送印。另外本技能只产出颜色,不含字体和素材授权判断,也不承诺任何品牌识别效果。
它适用于配色灵感和方案生成;成品图、Logo 绘制、印刷打样和品牌全案不在它的能力范围内。
使用场景
- 做网页设计时卡在主题色选择,需要把「科技感」这类模糊调性快速落地为一组可用的 hex 色值
- 给客户做品牌方案初稿,需要按行业(如母婴、环保)快速生成主色、辅助色与点缀色的搭配
- 编写 UI 规范时需要一组背景色与文字色组合,并确认对比度满足无障碍可读性要求
- 准备发布会 Keynote 或宣传海报,需要按奢华、清新等调性快速产出整套配色方案
适合人员
- 网页与 UI 设计师:需要在动手画界面前拿到一组有依据、可直接写入代码的主色与辅助色
- 品牌与视觉设计师:需要按行业调性快速产出多版配色方案供客户挑选
- 前端工程师:需要在写 CSS 前确定页面配色,并确保文字与背景对比度达标
- 新媒体与 PPT 制作者:需要为海报、长图和演示文稿挑选符合调性的整套颜色