Color Blindness Simulator

🖼️

Drop an image here, or click to select

Population Statistics

TypeAffected conesMalesFemalesEffect
ProtanopiaRed (L)~1%~0.01%Reds appear dark
DeuteranopiaGreen (M)~1%~0.01%Red-green confusion
TritanopiaBlue (S)~0.003%~0.003%Blue-yellow confusion
AchromatopsiaAll~0.003%~0.003%Full grayscale vision

Overall, approximately 8% of males and 0.5% of females have some form of color vision deficiency.

About This Tool

How to Use
  1. Upload an image to simulate
  2. Select a color blindness type from the options
  3. Compare the original and simulated views side-by-side
  4. Use Show All to see every simulation at once
  5. Download simulated images for accessibility documentation
Common Use Cases
  • Testing UI designs for color accessibility compliance
  • Understanding how color-blind users see your website
  • Preparing accessible presentations and documents
  • Learning about different types of color vision deficiency
Tips & Tricks
  • About 8% of males and 0.5% of females have some color vision deficiency
  • Protanopia and Deuteranopia are the most common types
  • Use this tool alongside the Color Converter to choose accessible color schemes
  • If your design relies on color alone to convey information, it may fail accessibility checks

You might also like

Color Converter

Convert colors between HEX, RGB, HSL, HSV, CMYK, XYZ, and LAB formats. Bi-directional conversion with live color preview as you type.

Image Grayscale Converter

Convert your images to grayscale effortlessly. Perfect for artistic transformations and detailed image analysis.

Favicon Generator

Generate a complete favicon package from any image or emoji. Creates PNG at all standard sizes (16x16 to 512x512) and Apple Touch icons — download individually or all at once.

CSS Gradient Generator

Create beautiful CSS gradients visually. Choose between linear, radial, and conic gradient types, add multiple color stops, and copy the ready-to-use CSS background property directly into your stylesheet.