Color Blindness Simulator
See how colors appear to people with color vision deficiency
Simulation Results
Protanopia
No red cones - reds appear dark, red-green confusion
Original
Simulated
Per-color breakdown
Shift: 180 (significant)
Shift: 152 (significant)
Shift: 81 (significant)
About Color Vision Deficiency
Protanomaly
(L-cones (red))Reduced red cone sensitivity - weakened red perception
Affects: ~1% of males, 0.01% of females
Protanopia
(L-cones (red))No red cones - reds appear dark, red-green confusion
Affects: ~1.01% of males, 0.02% of females
Deuteranomaly
(M-cones (green))Reduced green cone sensitivity - most common CVD type
Affects: ~5% of males, 0.35% of females
Deuteranopia
(M-cones (green))No green cones - greens appear beige, red-green confusion
Affects: ~1.27% of males, 0.01% of females
Tritanomaly
(S-cones (blue))Reduced blue cone sensitivity - weakened blue-yellow distinction
Affects: ~0.01% of population
Tritanopia
(S-cones (blue))No blue cones - blues appear greenish, yellow-blue confusion
Affects: ~0.003% of population
Achromatopsia
(All cones)Total color blindness - sees only shades of gray
Affects: ~0.003% of population
Was this tool helpful?
What is Color Blindness Simulator?
Free online color blindness simulator to visualize how your color palettes and images look to people with different types of color vision deficiency (CVD).
This free online simulator supports protanopia (red-blind), deuteranopia (green-blind), tritanopia (blue-blind), and achromatopsia (total color blindness). Use the Color Palette mode to test hex colors side by side, or upload an image in Image mode to see pixel-accurate simulations powered by the Canvas API. All processing runs entirely in your browser -- your images and colors never leave your device. No signup required.
How to Use Color Blindness Simulator
- 1Choose between Color Palette mode or Image mode using the tabs at the top
- 2In Color Palette mode, add hex colors using the color picker or text input to build your palette
- 3In Image mode, upload an image by clicking the upload area or dragging and dropping a file
- 4View the simulated results across all color vision deficiency types displayed in a grid
- 5Use the results to identify problematic color combinations and improve your design's accessibility
Frequently Asked Questions
Related Tools
Color Contrast Checker
Free online color contrast checker - check WCAG color contrast ratios for accessibility compliance
Open Graph Preview
Free online open graph preview - preview how your page looks when shared on social media platforms
Website Speed Test
Free online website speed test - analyze page load performance metrics
Color Palette Generator
Free online color palette generator - generate beautiful color palettes from any base color
Glassmorphism Generator
Free online glassmorphism generator - create glass-effect CSS styles with blur and transparency
CSS Specificity Calculator
Free online CSS specificity calculator - calculate and compare CSS selector specificity scores instantly