Designing for Color Blindness: A Data-Driven Guide

The Numbers: Who Is Affected?

Color vision deficiency (CVD) — commonly called "color blindness" — affects approximately 8% of men and 0.5% of women of Northern European descent. The disparity exists because the most common forms are X-linked recessive traits: men have one X chromosome, so a single defective gene causes CVD; women need defective genes on both X chromosomes.

Global prevalence varies by population. Studies by Birch (2012) in Survey of Ophthalmology show rates of 8.0% in Caucasian males, 4.0–6.5% in East Asian males, and 2.0–4.0% in African males. Among women, rates range from 0.4% to 0.8% across populations.

In practical terms: in a meeting of 25 people, there is a 87% chance at least one person has CVD. On a website with 10,000 daily visitors, roughly 400 see your colors differently than you intend.

Types of Color Vision Deficiency

CVD is classified by which cone type is affected. The names come from Greek: protos (first), deuteros (second), tritos (third), referring to the L, M, and S cone types respectively.

Red-Green Deficiencies (99% of cases)

People with protanopia or protanomaly have difficulty with colors in the long-wavelength (red) region. Red appears darker and more brownish. People with deuteranopia or deuteranomaly confuse colors in the middle of the spectrum — green and red can appear as similar muddy yellow-browns.

Blue-Yellow Deficiency (rare)

Tritanopia is autosomal (not sex-linked), so it affects men and women equally. It is extremely rare. Blue appears greenish, and yellow appears pinkish or light gray.

Complete Color Blindness

Achromatopsia (rod monochromacy) is the total absence of functioning cone cells, affecting roughly 1 in 30,000 people. People with achromatopsia see only in shades of gray, are extremely sensitive to bright light, and have reduced visual acuity. On the island of Pingelap in Micronesia, about 10% of the population has achromatopsia due to a genetic bottleneck — a fact documented by Oliver Sacks in his 1997 book The Island of the Colourblind.

Simulating Color Blindness: The Brettel Algorithm

How do you know what your design looks like to someone with CVD? The standard simulation algorithm was developed by Hans Brettel, Françoise Viénot, and John Mollon in 1997 (published in the Journal of the Optical Society of America A). The Brettel-Viénot-Mollon algorithm works by projecting colors in LMS cone space onto reduced-dimension planes that represent dichromatic vision.

This algorithm (or its simplified version by Viénot et al., 1999) is what powers CVD simulation tools in Figma, Adobe, Chrome DevTools, and most accessibility checkers.

Design Guidelines: What TO Do

• Use patterns and textures alongside color. In charts and graphs, add different dash styles, fill patterns, or shape markers. Do not rely on color alone to differentiate data series.
• Add text labels directly. Instead of a color-coded legend that requires matching, label items directly on the chart or use tooltips.
• Ensure sufficient luminance contrast. Even if hue distinction fails, lightness differences remain visible. Use our Color Wheel to check that colors differ in lightness, not just hue.
• Use a CVD-safe palette. Blue and orange are distinguishable by almost all forms of CVD. Blue and yellow (the opponent channel that is unaffected in red-green CVD) also work well.
• Use icons or shapes for status. A green checkmark and red X is better than a green circle and red circle, because the shape conveys meaning independent of color.
• Maintain WCAG AA contrast ratios. A minimum contrast ratio of 4.5:1 for normal text ensures readability regardless of CVD type.

Design Guidelines: What NOT to Do

• Do not use red and green as the only distinction. This is the single most common accessibility failure. Red/green for success/error, available/unavailable, or buy/sell is invisible to ~8% of male users.
• Do not use color as the sole indicator of state. If a form field turns red on error, also add an error icon and text message.
• Do not use too many colors. Research by Healey (1996) showed that pre-attentive color discrimination works reliably for up to 7 distinct colors in trichromats. For CVD users, that number drops to 4–5.
• Do not assume "colorblind-friendly" means grayscale. Most people with CVD see many colors — they just confuse certain pairs. Design for specific confusion axes, not for monochromacy.

Real-World Case Studies

Traffic Lights

Traffic lights were standardized by the 1968 Vienna Convention on Road Signs and Signals. For CVD users, the green and red lights can appear similar. The solution is position coding: red is always on top, green on bottom. In Japan, traffic "green" lights are actually a blue-green #00B894 to improve distinguishability. In Canada, some provinces add shapes (a diamond for red, a bar for yellow, a circle for green) to traffic signals.

Subway Maps

Tokyo Metro redesigned its map in 2004 to improve CVD accessibility. Each line received not only a distinct color but also a letter code (G for Ginza, M for Marunouchi) and a unique line pattern. The London Underground, whose iconic map was designed by Harry Beck in 1931, has been criticized for using colors (like the Central/red and Jubilee/gray) that some CVD users find hard to distinguish. Transport for London added line names directly to modern digital maps to address this.

Video Games

Many modern games include CVD modes. Fortnite offers Protanope, Deuteranope, and Tritanope settings that remap team colors and UI elements. Overwatch allows complete customization of team and enemy outline colors. Uncharted 4 was praised for adding CVD options that changed the color of handholds and interactive objects — critical gameplay elements that were otherwise red/green coded.

CVD-Safe Color Combinations

Based on research by Wong (2011) in Nature Methods, here is a palette optimized for all forms of CVD:

Tools and Testing

Always test your designs through a CVD simulator before shipping. Use our Color Converter to examine color values and ensure sufficient contrast between elements. Build palettes with our Color Wheel while keeping CVD-safe combinations in mind. And explore our curated palettes for accessible inspiration. Designing for color blindness is not a constraint — it is a design discipline that makes your work better for everyone.