ilovekit

Color Blindness Simulator

9 tools

Preview a color under color blindness.

Runs in your browser — your files and text stay on your device

Pick a color and get an instant palette, extract dominant colors from a photo, mix two colors, build gradients, check WCAG contrast, simulate color blindness, or browse a reference of named and Tailwind-style colors — all computed locally as you adjust each control.

Picker & PaletteShade ScalePalette from ImageColor MixerGradient GeneratorContrast CheckerColor BlindnessNamed ColorsPalette Reference
Original
#3b82f6
Protanopia
#5a5ada
Deuteranopia
#5650d3
Tritanopia
#3fc4bf

How to use this tool

  1. 1Pick a color.
  2. 2See how it appears under three common types of color blindness (protanopia, deuteranopia, tritanopia).

Frequently asked questions

What's the difference between the three types?

Protanopia and deuteranopia are red-green color blindness (the most common types, affecting red and green cone cells respectively); tritanopia is blue-yellow color blindness, much rarer.

Why does this matter for design?

Roughly 1 in 12 men and 1 in 200 women have some form of color blindness — checking that your color choices remain distinguishable helps make a design accessible to them.

Is my color sent to a server?

No, the simulation is computed entirely in your browser using standard color-blindness transformation matrices.

Guides

All guides →