Communitygithub.com

getrdone/color-palette-composition

创建、修改、评审或记录用于室内设计、图形、品牌、网页、界面、数据展示和印刷的高关注度色彩主题。适用于需要协调调色板、配色方案、比例、布局、混色或视觉层次的任务;不用于孤立的单色选择。

color-palette-composition 是什么?

该技能旨在系统性地构建色彩调色板或主题,确保视觉注意力的受控分布,而非仅仅是颜色样式的堆砌。它强调视觉重量(由面积、色度、局部对比度、温度和隔离度决定)在配色中的主导作用,认为色调是次要因素。该技能是生成或实质性修改调色板的权威工作流,其他系统可提供约束条件、故事、语义角色、实现标记或解释证据,但不能替代本组合工作流。它支持中等应用(室内/图形/UI/数据/印刷)、启动套件(示例/和谐模式)以及验证与交接(正式交付/对比度/溯源/设计令牌桥接)三种模块,可根据任务需要选择性加载,避免冗余。该技能强制要求使用双重透镜方法(Itten对比理论与Munsell色彩体系)分析每种主题,并生成包含注意力目标、命名合同(如规范故事名称需与品牌色/语义角色区分)、视觉重量评估以及理论总结的YAML格式清单,确保设计可解释、可溯源、可复现。它适用于Claude Code、Cursor、Codex等AI代理平台,尤其适合需要精确色彩层次和设计交接的专业场景。

兼容平台~Claude Code✓Codex CLI~Cursor
npx skills add https://github.com/getrdone/agent-skills/tree/main/skills/color-palette-composition

在你喜欢的 AI 中提问

打开一个已预加载此 Agent Skill 的新对话。

文档

色彩调色板组合

构建注意力的受控分布,而非一堆漂亮的色卡。色调次于视觉重量:面积、色度、局部对比度、温度和隔离度决定调色板是否协调一致。

这是生成或实质性修改调色板/主题的规范技能。其他系统可提供源约束、故事、语义角色、实现标记或解释证据;它们不能取代本组合工作流。

仅加载任务所需的内容

对于每个实质性的新主题或修订主题,阅读核心组合。然后仅加载相关的模块:

需求阅读
室内、图形/编辑、UI、数据展示或印刷布局中等应用
起始示例或命名和谐模式启动套件
正式交接、对比度/生产验证、溯源或设计令牌桥接验证与交接

不要为常规评审加载启动套件,也不要仅仅因为任务是调色板任务就加载所有模块。核心部分始终是必需的;附加模块使技能精确,同时不使常规请求变得昂贵。

从简报开始

确定媒介、预期情绪和受众、来源/故事、固定颜色或材料、照明/输出条件、可访问性要求以及一个注意力目标。精确保留一种锁定颜色。将严肃值标记为 official、extracted、harmonized 或 semantic;派生色板不得成为虚假的品牌标准。

当“主色”可能产生歧义时,请使用 field / partner / spark。在房间或编辑构图中,最大的颜色通常是field。在UI中,primary 通常表示一个小的、高强调的动作颜色;使用 canvas、surface 和 on-* 来表示广泛的角色。

主题的强制双重透镜方法

对于每个实质性的提议配色方案或主题,应用并报告两个透镜。仅命名和谐或配方是不够的。

  1. 伊顿: 确定正在进行构图工作的一或两种对比(色相对比、明暗对比、冷暖对比、补色对比、同时对比、饱和度对比或面积对比)。当两个色度区域共存时,做出面积扩展决策,而不是假设面积相等。
  2. 芒塞尔: 命名构建色系的HVC路径(垂直明度、水平色相、向内通过灰色到达对立面),然后进行明度-色度校正。一个小而强烈的颜色可以平衡一个更大、更柔和的区域;百分比本身并非平衡。
  3. 视觉重量: 评估 重量 ~= 面积 x 色度 x 局部对比度。温度和隔离度会增强或减弱它。这是方向性的设计启发法,而非物理计算。
  4. 人类可读性: 包含一句或两句 theory_summary,命名所使用的伊顿和芒塞尔模式、它们改变了什么以及人类为何可以研究它们。

必需的命名约定

在交接前应用此约定。设计指令拥有令牌架构的所有权;此技能需要为其提供数据的调色板行为。

  • 为完成的主题和规范/故事色板提供简短、富有表现力、特定于源的名称(通常1-3个词)。不要将真实的设计颜色称为 Orange 1 或 Dark Blue。
  • 精确保留官方制造商或品牌颜色名称;将其记录为 official,而不是用诗意的别名替换它。
  • 保持规范故事名称与语义角色别名的分离:例如,Flame 可以映射到 --flame,而 --color-primary 或 action 描述其实现工作。角色可以更改,而无需重命名颜色故事。
  • 根据它们创建的图像/故事来命名标志性渐变(Fire Core、Wing Sweep),切勿使用 Gradient 1。通用构造标签仅是临时的。
  • 如果提供的源使用了通用名称,则保留溯源中的源标签,并仅当颜色不是锁定/官方时提议一个富有表现力的规范名称。

快速工作流

  1. 首先构建明度结构:可读的field加上ink/on-color。在灰度中失败的设计具有未解决的层次结构。
  2. 选择一个注意力目标。在色度、明度对比、冷暖对比、隔离或比例方面给予其最强的优势——而非所有要素。
  3. 对于注意力导向的编辑/活动/房间工作,考虑 70/20/10;对于密集、精致、信息导向的工作,考虑 80/15/5。这些是首选的首轮试验,而非规则。使用基于视觉重量理由的其他分割;仅在平衡的室内偏差适合时使用 60/30/10。
  4. 分配field、partner、spark、中性色/on-color和语义状态角色;将它们映射到表面或组件。
  5. 应用伊顿对比和芒塞尔HVC/明度-色度决策。在引入无关色调之前,先构建一个相关的色系。
  6. 运行两秒焦点测试、对比度/非颜色线索检查以及介质/输出测试。

不可协商的保障措施

  • 60/30/10 是一种有文献记载的室内设计惯例,而非全局默认或科学法则。
  • 一个未能通过对比度测试的锁定品牌颜色会改变角色。一个未锁定的派生颜色可以改变明度/色度、角色或两者。
  • 颜色绝不单独传达状态、类别、动作或错误;根据需要添加文字、图标、形状、图案、位置或下划线。
  • 不要将屏幕HEX值视为涂料配方或生产CMYK规格。使用其输出配置文件打样打印;在已安装的灯光下并紧邻固定材料测试涂料样品。
  • 启动配方是方向,而非默认品牌。根据当前来源重命名和重新派生它们。

必需的交接

对于实质性的调色板响应,酌情包含以下内容:

palette:
  medium: interior | graphic | ui | data-viz | print | mixed
  concept:
  attention_target:
  naming:
    theme_name:
    canonical_story_names: []
    semantic_role_aliases: {}
    signature_gradient_names: []
    official_names_preserved: []
  theory_lens: "Itten + Munsell"
  itten_application: { contrasts: [], extension_decision: "" }
  munsell_application: { hvc_path: "", value_chroma_correction: "" }
  visual_weight: "field / partner / spark rationale"
  theory_summary: "One or two sentences: named pattern, decision, and why."
  harmony:
  allocation:
  provenance: {}
  field: { name, value_or_material, placement }
  partner: { name, value_or_material, placement }
  spark: { name, value_or_material, placement }
  neutrals_and_on_colors: []
  semantic_states: []
  contrast_status:
  non_color_cues:
  production_or_light_test:
  do_not_use_as: []

theory_lens、itten_application、munsell_application 和 theory_summary 对于创建的主题是必需的。在随意解释中,以简洁的方式陈述它们,而不是发出完整的数据块。

完成条件

  • 每个保留下来的颜色都有规范名称或保留的官方名称、角色、分配、布局和溯源。
  • field、partner 和 spark 在两秒内显而易见。
  • 最强的色度/对比度赢得了其注意力。
  • 伊顿和芒塞尔决策均已被命名、应用和解释。
  • 文本、控件、有意义的图形和状态在实际环境中有效,并且不仅通过颜色来区分。
  • 在适用的情况下,结果在真实光照、显示器、库存或输出条件下进行了测试。

Individual skills in this repo

This repo contains 1 individual skill — each has its own dedicated page.

相关技能