Color Blindness Simulator
This color blindness simulator shows how an image, chart, or interface looks to
This color blindness simulator shows how an image, chart, or interface looks to
How to use Color Blindness Simulator
- Upload an image, or use the built-in color test pattern that loads automatically.
- Pick a type of color blindness from the dropdown to simulate it.
- Compare the original and simulated views, then download the result as a PNG.
About Color Blindness Simulator
This color blindness simulator shows how an image, chart, or interface looks to someone with color vision deficiency (CVD). Upload any image and it renders a side-by-side comparison of the original and a simulated version for eight conditions: protanopia, protanomaly, deuteranopia, deuteranomaly, tritanopia, tritanomaly, achromatopsia (total color blindness), and achromatomaly. A built-in color test pattern loads automatically, so you can see it working before uploading anything.
It works by applying the standard HCIRN color-transform matrices to each pixel using the browser's Canvas API. This is the same matrix approach used by most online CVD simulators — a solid approximation for checking whether your reds and greens, status colors, or data visualizations stay distinguishable. It is a design-review aid, not a medical or diagnostic tool, and does not replace a proper accessibility audit or a clinical color vision test.
Everything runs privately on your device. Your image is read straight into a canvas in your browser and never uploaded to a server, so it works offline and keeps your files private. Large images are scaled down to 1600px on the longest side to keep the simulation fast; you can download the simulated result as a PNG.
Frequently asked questions
- Which types of color blindness can it simulate?
- Eight: protanopia and protanomaly (red-weak/blind), deuteranopia and deuteranomaly (green-weak/blind, the most common), tritanopia and tritanomaly (blue-weak/blind), plus achromatopsia and achromatomaly (total and partial color blindness). Deuteranomaly affects roughly 1 in 12 men.
- How accurate is the simulation?
- It uses widely-adopted color-transform matrices (the HCIRN/Wickline set) applied per pixel. That is a good, standard approximation for design and accessibility checks, but real color perception varies from person to person, and this is not a medical or diagnostic tool.
- Are my images uploaded anywhere?
- No. The image is loaded directly into a canvas in your browser and processed locally with JavaScript. Nothing is sent to a server, so it works offline and your files stay private.
- What image formats can I use?
- Any format your browser can display, including PNG, JPG, WebP, and GIF. The simulated result is always exported as a PNG.
- Why is my large image slightly smaller in the result?
- Images larger than 1600px on the longest side are scaled down before simulation so the per-pixel processing stays fast. The aspect ratio is preserved.
- Can I use this to check my website or chart colors?
- Yes. Take a screenshot of your UI, chart, or design, upload it, and switch between CVD types to confirm that important colors — like red/green status indicators — remain distinguishable. Pair color with labels, patterns, or icons where they don't.