UtilityBaseImage Tools
Color Blindness Simulator
Upload an image to preview how it looks with each type of color-vision deficiency.
Updated July 10, 2026
How to use the color blindness simulator
- 1Drop an image or screenshot, or click to choose.
- 2View all the color-vision-deficiency versions side by side.
- 3Check that key colors stay distinguishable.
- 4Adjust your design and re-check as needed.
Common uses
- Testing a design or chart for accessibility
- Checking whether brand colors stay distinct
- Previewing a UI for colorblind users
- Understanding how others see your images
Frequently asked questions
What types of color blindness does it simulate?
It shows protanopia and protanomaly (red), deuteranopia and deuteranomaly (green), tritanopia and tritanomaly (blue), and achromatopsia (no color), alongside normal vision for comparison.
How accurate is the simulation?
It uses widely accepted color-transformation matrices, which are good approximations rather than a clinical simulation. They're reliable enough to catch accessibility problems, but real perception varies from person to person.
How do I make a design colorblind-friendly?
Don't rely on color alone. Pair it with labels, patterns, icons, or shapes, keep strong contrast, and avoid problem pairs like red-green for meaning. Preview your design here to confirm the important elements stay distinguishable.
About this tool
The color blindness simulator shows how an image, design, or screenshot appears to people with different types of color-vision deficiency — protanopia, deuteranopia, tritanopia and their milder forms, plus full color blindness. Upload a picture and it renders all the versions side by side, so you can check that your colors stay distinguishable and your design is accessible. It uses widely accepted simulation matrices, applied locally with the Canvas API, so your image is never uploaded.
Like most tools on UtilityBase, the color blindness simulator runs entirely in your browser — nothing you enter is uploaded or stored on a server. It's free to use with no account required. Browse more image tools here.
Was this tool helpful?
Related tools
Color Contrast Checker
Check WCAG contrast ratios between text and background colors — AA and AAA.
Developer Tools
Color Picker
Pick a color and get HEX, RGB, and HSL values with shades and tints.
Image Tools
Color Palette Generator
Turn one base color into complementary, analogous, triadic, and shade palettes.
Generators
Hex to RGB Converter
Convert colors between HEX, RGB, and HSL — edit any field and the rest update.
Developer Tools
Background Remover
AI background removal that runs on your device — no upload, no watermark, no limits.
Image Tools
Video Compressor
Shrink videos for Discord, email, or storage — without uploading them anywhere.
Image Tools