How to Choose a Brand Color Palette: A Systematic Method

Start from constraints, not inspiration

The fastest way to a palette you'll abandon in six months is to start by browsing pretty combinations. Start instead with the constraints that will judge every candidate anyway:

• Where will this live? Screens only, or print too? If print matters, extremely vivid screen colors will disappoint on paper — the gamut problem is real and unfixable after the fact.
• What's the competitive field? If every competitor is blue, blue costs you distinctiveness — arguably the only psychological effect of brand color that's reliably real, as our color psychology guide argues.
• What must it do functionally? It will need to carry text, pass contrast on white and on dark surfaces, and stay distinguishable from your semantic colors (success/warning/error). A hue that can't do those jobs is a logo color, not a brand system.

Pick one base hue, deliberately

A brand system needs exactly one primary decision: the base hue. Explore the wheel with actual relationships in mind — the color wheel shows complements and analogues live, and our harmony guide explains what each relationship buys you. Candidates worth testing: the hue at moderate-to-high saturation and middle lightness (your future 500), which is where buttons and links will live.

Resist choosing three or four "main" colors up front. Mature product palettes are usually one brand hue, a disciplined neutral ramp, one accent at most, and semantic colors — nearly everything you admire as "great brand color" is one hue used with conviction.

Turn the hue into a working scale

A single hex is not a usable system; you need the ladder of lighter and darker variants that real interfaces demand — backgrounds, hovers, borders, text. Generate the 50–900 scale from your base with the palette generator and inspect it honestly: the pale end should still read as your color against white, and the dark end should stay a hue, not slide into generic black — the mechanics are in our shades, tints, and tones guide. Then locate the two workhorses:

• The text-safe step: the lightest variant that clears 4.5:1 on white (verify in the contrast checker — don't eyeball it).
• The surface steps: a near-white tint for tinted backgrounds and a 300-ish variant for dark-mode accents, because your 600 will almost certainly fail on dark surfaces — see the dark mode guide.

Add neutrals and semantics — the unglamorous 90%

By pixel count, your real brand color is gray. Choose a neutral ramp with intent: dead-neutral grays feel technical; grays tinted faintly toward your brand hue feel warmer and cohere better. Keep the tint subtle enough that grays still read as gray next to true color.

Semantic colors need two properties: conventional enough to be instantly parsed (green-ish success, amber-ish warning, red-ish error) and clearly distinct from your brand hue. A green brand with green success states produces permanent ambiguity — shift the success hue toward teal, or lean harder on icons. And because red/green is exactly the pair color vision deficiency collapses, run the semantic set through the color blindness simulator and follow the CVD playbook: icons and labels beside every colored state.

Prove it before you ship it

Mock the palette into real screens — a form with validation, a data table, a marketing hero, both light and dark. Check every text-bearing pair for AA. Run the full palette's pairwise CVD report (every palette page on this site computes one). Then write it down as semantic tokens — primary, surface, text-secondary — not raw hexes scattered through code, so the inevitable adjustments happen in one place. A brand palette isn't the mood board that inspired it; it's the tested, named, constraint-satisfying system that survives contact with an actual product.