color-palette-builder

Installation
SKILL.md

Color Palette Builder

A brand color palette is not a mood board - it is a functional system with roles, scales, and rules. The costly failure is shipping pretty swatches with no usage rules: developers guess, screens drift, and within months the product has fourteen slightly different blues and body text that fails contrast. Build the palette so a developer can implement it without asking a single question.

Operating procedure

Work the steps in order: roles before scales, scales before contrast checks - contrast is verified per color pair, and pairs only exist once the scales do.

Step 1: Gather inputs

Collect these before generating anything; label any guess as a guess.

  • Anchor color, if one exists (hex value). If none, collect 3-5 brand adjectives plus the category's color conventions to derive one.
  • Surfaces in scope: marketing site, product UI, or both. Product UI needs a deeper neutral scale.
  • Dark mode: in scope now, later, or never. Default to architecting semantic tokens regardless - it adds no cost now and prevents significant rework later.
  • Accessibility target: default WCAG 2.1 AA. Ask whether AAA is required (government, healthcare, and education products often require it).
  • Constraints: category semantics (red and green in finance already mean loss and gain), competitor colors to avoid, and any existing token naming convention to match.

Step 2: Choose or validate the anchor

Installs
7
GitHub Stars
1
First Seen
13 days ago