Online Color Blindness Simulator

Preview design colors and images through common color-vision deficiency simulations before shipping an interface. It helps designers review whether status colors, charts, and controls remain distinguishable for people with color-vision deficiencies.

What is a color blindness simulator?

A color blindness simulator approximates how a color palette or image may appear to people with different color-vision deficiencies. It is useful for spotting low-contrast or color-only communication problems during design review.

How to use this simulator

Choose a color or upload an image, then select a vision mode. The canvas preview is recalculated locally whenever you change the source or mode.

Design for more people

Do not rely on color alone to communicate status. Pair color with labels, icons, patterns, or shape, and verify text contrast with an accessibility checker.

How to use Color Blindness Simulator for related tasks

Preview a color or image under each mode, then add labels, patterns, or icons wherever color alone carries meaning.

Related tools: Color Converter, CSS Effects Generator.

Frequently asked questions

Is my uploaded image sent anywhere?

No. The image is read locally with FileReader and drawn to a canvas in your browser. It is not uploaded or stored.

Which color vision conditions are simulated?

The simulator includes protanopia, deuteranopia, tritanopia, and achromatopsia alongside the normal view.

Is this a medical diagnosis?

No. These are visual approximations for accessibility and design review, not a clinical assessment of color vision.

How can I test a palette for color accessibility?

Run the palette through several vision modes and pair the result with a contrast checker; simulation is a design aid, not a medical diagnosis.