Free web tool

Color vision deficiency simulator

Preview an image with approximate protanopia, deuteranopia, tritanopia, or achromatopsia simulation.

Input & settings

How to use

Preview an image through several approximate color-vision-deficiency transforms. The goal is to spot information that becomes hard to distinguish when a design relies too heavily on color alone.

  1. Choose the image you want to review.
  2. Select Protanopia, Deuteranopia, Tritanopia, or Achromatopsia approximation.
  3. Compare the transformed image and check whether important distinctions remain. Download the PNG if useful for review.

This is not a medical reproduction of vision

The tool applies common approximation matrices to RGB values. It cannot reproduce every individual’s perception and it is not a diagnostic tool.

Use it as an early design check: “does this distinction disappear when color relationships change?”

Look for information encoded only by color

Red vs green graph series, success vs error, and selected vs unselected states can become ambiguous when color is the only signal.

Keep labels, icons, patterns, shapes, or text so that the same meaning survives even when colors become harder to distinguish.

Color simulation and contrast are different checks

Two colors may remain distinguishable in the simulation while text contrast is still too low. The reverse can also happen: text passes contrast requirements but two chart series still look too similar.

Check text/UI contrast separately with WCAG contrast checker.

Review more than one mode

A design that looks fine in one approximation is not automatically robust for everyone. Cycle through the main modes and watch whether any critical information disappears.

When you fix a problem, adding a non-color cue is usually more reliable than trying to “tune” the original colors for every viewer.