Color Blindness Simulator

These are the three forms of dichromacy, where one type of cone cell is missing entirely. Protanopia is red-blindness: the red-sensing cones are absent, so reds look dark and muted and red/green pairs collapse together. Deuteranopia is green-blindness, caused by missing green cones, and produces a similar red/green confusion that is the most common pairing people struggle with. Tritanopia is blue-blindness, where blue and yellow become hard to tell apart; it is far rarer than the red/green types. Each has a milder "anomalous" version — protanomaly, deuteranomaly, and tritanomaly — where the cone works but is shifted rather than missing. This simulator renders all of them, and the all-types grid lets you view every one side by side so you can see exactly which colors break for each group.

Color vision deficiency is common: roughly 1 in 12 men (about 8%) and 1 in 200 women have some form of it, which works out to around 350 million people worldwide. The single most widespread type by a wide margin is deuteranomaly — a reduced sensitivity to green — which affects close to 5% of men. Because it is so prevalent, this tool defaults to deuteranomaly when you open it, so your first preview reflects the largest share of affected viewers. Red/green deficiencies as a group (the deutan and protan types) far outnumber the blue/yellow tritan types, which is why the red/green color pairing is the one accessibility guidelines warn about most. Run your design through deuteranomaly first here, then check the other types to cover the rest of your audience.

Normal color vision relies on three cone types tuned to roughly red, green, and blue light, and your brain judges color by comparing their signals. In the common red/green deficiencies, the red and green cones either overlap too much (the anomalous types like deuteranomaly and protanomaly) or one is missing entirely (deuteranopia and protanopia). Because red and green sit close together on the spectrum, the brain loses the contrast it normally uses to separate them, so a red apple and green leaves can read as similar muddy tones. This is why a red/green chart legend or a red-error versus green-success status can become indistinguishable. The fix is never relying on color alone — add labels, icons, or patterns. Paste your two colors into the simulator's analyzer to confirm whether they actually stay distinct.

This simulator uses standard color-matrix transformations applied to every pixel — the same RGB-remapping approach used by established accessibility tools like Coblis. That makes it a reliable approximation for catching design problems, such as legend colors that merge or status indicators that lose contrast. It is not, however, a medical diagnostic or a perfect replica of any one person's vision. Real color perception varies between individuals, depends on lighting, and is shaped by the brain's adaptation, none of which a fixed matrix fully captures. The severity slider helps here: most people with a deficiency have a partial, anomalous form rather than total loss, so previewing at less than full severity is often closer to reality than older all-or-nothing simulators. Use it to verify and fix designs, not to assess anyone's eyesight.

Contrast is measured as a ratio between the relative luminance of a foreground and background color, and WCAG sets the benchmarks at 4.5:1 for normal text and 3:1 for large text to meet AA. This tool's built-in contrast checker computes that ratio for any two colors and tells you instantly whether it passes AA and the stricter AAA. Crucially, you can also evaluate the ratio as simulated through a chosen deficiency type, because color blindness can quietly erode contrast that looked fine to full-color vision. For multi-color schemes, the palette checker builds a contrast matrix across every pair so you can spot combinations that collapse together. It even ships colorblind-safe reference palettes like the Okabe-Ito set as a starting point. Enter your foreground and background colors above to test them.