All Insights
IdentityMay 20265 min read

Color systems: how to choose a palette that survives five years

Most brand palettes are chosen for how they look in a mockup, not for how they'll hold up across a product UI, a dark mode, and a hundred future marketing assets. Here's the difference.

ColorBrandIdentity

A color palette gets chosen in a moment — usually while looking at three or four mockups side by side, picking whichever feels most 'right.' That decision then has to survive years of application across contexts nobody was thinking about in the room: a product UI with hundreds of states, a dark-mode variant, a printed one-pager, a co-branded slide deck. Palettes chosen for a single mockup rarely survive that stretch.

The palettes that do survive are chosen as systems, not as a handful of pretty swatches. That means defining not just the brand colors but the functional roles they'll need to play — and testing them against contexts the mockup never showed.

What a color system actually needs to specify

  • A primary and secondary brand color, plus the tint/shade ramp each needs for hover states, disabled states, and backgrounds
  • Semantic colors for success, warning, and error states that read clearly against both light and dark backgrounds
  • A neutral scale (grays) with enough steps to handle text hierarchy, borders, and surfaces without looking flat
  • Accessible contrast ratios for every text-on-background pairing you expect to actually use

If your brand palette doesn't include a plan for dark mode, it isn't a system yet — it's a set of colors that will need a redesign the first time someone asks for one.

The mistake: choosing colors that only work at large sizes

A saturated brand color that looks striking as a hero background can be nearly unusable as body text or a small UI element — it may fail contrast requirements or simply vibrate uncomfortably at small sizes. Test every color at the sizes it will actually appear at, not just the size it was chosen at.

4.5:1
minimum contrast ratio (WCAG AA) for normal body text against its background

Building in room to grow

The palettes that last five years usually have one deliberate placeholder built in — a tertiary or accent color reserved but not yet heavily used, so a future product line or campaign has somewhere to go without requiring a full palette revision. Locking every color to a specific, saturated use on day one is what forces a redesign the first time the brand needs to say something new.

Next Article

Voice and tone: writing brand guidelines people actually read

Identity · 4 min read

Read Next