Roughly one in twelve men and one in two hundred women perceive color differently, most commonly with a reduced ability to distinguish red from green. A palette that relies on those distinctions to carry meaning fails a meaningful slice of its audience. Designing for color blindness is not a niche courtesy; it is basic communication.
Key takeaways
- Red-green deficiency is by far the most common type, so never let red versus green be the only signal.
- Lightness differences survive every type of color vision — build meaning on lightness first.
- Blue and orange is the most reliable two-color signal pair.
- Always add a second channel: an icon, a label, a pattern or a position.
The common types, briefly
Most color vision deficiency falls into a few patterns:
- Deuteranomaly and protanopia affect red-green perception. Together these account for the large majority of cases.
- Tritanopia affects blue-yellow perception and is considerably rarer.
- Monochromacy, the total absence of color perception, is rarest of all.
Because red-green dominates the statistics, one rule carries most of the weight: never let red versus green be the only thing separating two states.
Lightness survives everything
Whatever a person's color perception, differences in lightness remain visible. Two colors that differ clearly in lightness stay distinguishable even in full monochromacy. This is the foundation of a color-blind-safe palette: build meaning on lightness contrast, and treat hue as a bonus layer rather than the message itself.
Convert your palette to greyscale. If two colors that must be told apart become the same grey, they will be confused by someone, somewhere.
Safe and risky pairings
Red and green at similar lightness is the classic trap — the traffic-light pairing that fails for the largest affected group. Safer signal pairs use blue against orange, or any two colors with a wide lightness gap. When a brief demands red and green together, make one substantially darker than the other so lightness continues to separate them even when hue does not.
Charts deserve extra care
Data visualization is where color-only encoding does the most damage, because a legend is often the only key to the chart. Limit categorical palettes to colors that differ in lightness as well as hue, label lines and segments directly rather than relying on a colored legend, and use pattern or dash style as a second channel on line and area charts. Six colors is a practical ceiling; beyond that, no palette stays distinguishable for everyone.
Never rely on color alone
The most robust fix is to stop asking color to do the whole job. Add a second channel of information wherever a color carries meaning:
- Icons or symbols alongside colored states — a check and a cross, not just green and red.
- Text labels on chart segments rather than a color-only legend.
- Patterns, textures or borders to distinguish areas in a graphic.
- Position and grouping, which read identically for every viewer.
This principle connects directly to building accessible palettes: color is one signal among several, never the only one.
Test with real simulation
Design intuition is unreliable here, because most designers have typical color vision and cannot see the failure they are shipping. Use a color-blindness simulator to preview your palette as each type of vision would perceive it, and confirm that every meaningful distinction survives. Combined with a contrast check, that gives you a palette which communicates for the whole audience rather than most of it.
The greyscale pass belongs in your workflow
Make the greyscale check a routine step rather than an occasional audit. Most design tools can desaturate a frame in a click, and browsers can apply a grayscale filter to a live page. Look specifically at the places where color carries information: status chips, chart series, selected states, required-field markers and anything red or green. If two of them become the same grey, add a second signal before moving on. Doing this while you design costs seconds; doing it after an accessibility review costs a redesign of every component that inherited the problem. The same pass also flags weak contrast, since a low-contrast pairing looks obviously flat in grey.
Frequently asked questions
Is there a single color-blind-safe palette I can reuse?
Several published sets exist, and they all follow the same logic: wide lightness spacing and blue-orange rather than red-green oppositions. You can build one yourself with those two constraints.
Do I have to avoid red and green completely?
No. Use them freely as decoration, and only avoid making them the sole carrier of meaning. A red button and a green button that also differ in label and icon are fine.
Does dark mode change what is safe?
It changes the lightness relationships, so recheck. A pair that separated well on white can converge on a dark surface once both colors are lifted.
Design for the widest color vision first and the palette gets clearer for everyone — higher lightness contrast and redundant signals help in bright sunlight and on cheap screens too.
