Color Blind Simulator

See any palette through protanopia, deuteranopia, tritanopia and achromatopsia. Paste any HEX colors below and compare all four types of color-vision deficiency side by side.

Shortcuts: / search Β· R randomize Β· T theme

Why simulate color blindness?

Roughly 8% of men and 0.5% of women have some form of color-vision deficiency. If your chart, UI state or map relies on red vs. green alone, a large share of users may not perceive the difference. Simulating protanopia (missing red cones), deuteranopia (missing green cones), tritanopia (missing blue cones) and achromatopsia (complete color blindness) reveals where your palette needs redundant cues β€” labels, patterns or brightness differences. See our color accessibility guide for design strategies.

Frequently asked questions

What contrast ratio does WCAG require?

WCAG 2.2 AA requires 4.5:1 for normal text and 3:1 for large text (18pt+, or 14pt bold) and UI components. AAA raises these to 7:1 and 4.5:1.

How is the contrast ratio calculated?

It compares the relative luminance of the two colors using the WCAG formula (L1 + 0.05) / (L2 + 0.05), producing a ratio between 1:1 and 21:1.

What if my colors fail?

The tool automatically suggests the nearest shade of your text color that passes AA β€” click Apply to use it.

Does this cover color blindness too?

Yes β€” every check includes a simulation of your color pair under protanopia, deuteranopia, tritanopia and achromatopsia, with recalculated ratios.