Color Blind Simulator
Simulate how images and color palettes appear to people with color vision deficiency.
Supports Protanopia, Deuteranopia, Tritanopia, and Achromatopsia. Safe to use with no server connection.
Vision Type
Original
Simulated
Add Color
| Original | Protanopia | Deuteranopia | Tritanopia | Achromatopsia |
|---|
※ Max 12 colors
About
This tool simulates how images and color palettes appear to people with color vision deficiency (CVD). It supports 4 types: Protanopia, Deuteranopia, Tritanopia, and Achromatopsia.
It is ideal for accessibility testing of web designs and printed materials. Because all image processing is done entirely within your browser, you can safely use it even with highly confidential images.
* This tool performs color vision simulation based on the Brettel method. It is a simplified simulation and is not intended for medical diagnosis.
How to use
Input Image or Color
Select an image file or add colors in Color Palette mode. Images are never sent to a server.
Select Vision Type
Choose from Protanopia, Deuteranopia, Tritanopia, or Achromatopsia. The preview updates in real-time.
Check Results
Compare the original image alongside the simulation result. You can save the output as a PNG file by clicking "Save Result".
Glossary
- Color Vision Deficiency (CVD)
- A characteristic where color perception differs from typical vision due to variations in specific photoreceptor functions in the retina. It is quite common globally, affecting approximately 1 in 20 (5%) Japanese men and about 8% of Caucasian men.
- Protanopia
- A condition where the function of L-cones (which primarily detect red light) is absent or reduced. Reds tend to appear darker and muted, making it difficult to distinguish between red and green, or red and black.
- Deuteranopia
- A condition where the function of M-cones (which primarily detect green light) is absent or reduced. It is the most common type of CVD. Like Protanopia, it makes distinguishing red and green difficult, though reds do not typically appear as unnaturally dark.
- Tritanopia
- A condition where the function of S-cones (which primarily detect blue light) is absent or reduced. It becomes very difficult to distinguish between blue and yellow, causing the world to appear primarily in red, pink, and teal hues. It is extremely rare.
- Achromatopsia (Monochromacy)
- A condition where cone cells do not function at all, and vision relies entirely on rod cells (which only detect light intensity). The world is perceived exclusively in monochrome shades (gradients of gray), much like a black-and-white photograph.
- Cone Cells
- Photoreceptor cells concentrated in the center of the retina (macula) responsible for perceiving color and fine details. They are classified into three types based on the light wavelengths they detect: L-cones (red), M-cones (green), and S-cones (blue).
- Accessibility
- The degree to which information, services, and products are equally accessible and usable without inconvenience by everyone, including the elderly, people with disabilities, and individuals with specific characteristics (like color vision diversity).
- Color Universal Design
- A design approach carefully considered so that information can be accurately read by all people, regardless of their color vision diversity. It aims for universally recognizable communication by combining shapes, patterns, and text instead of relying solely on color.
- sRGB
- A standard color space specification defined by the IEC, widely used across the web, standard PC monitors, and smartphones. It serves as the baseline reference for the color transformation processes in this tool.
- Brettel Method
- A color blindness simulation algorithm proposed by Hans Brettel and colleagues in 1997. It physically and mathematically links the spectral sensitivity of the human eye with the emission characteristics of color monitors to reproduce how dichromats perceive the world with extremely high accuracy.
FAQ
- Q.Which color blindness types are supported?
- We support 4 major types: Protanopia (Type 1), Deuteranopia (Type 2), Tritanopia (Type 3), and Achromatopsia (Monochromacy). You can simulate how specific colors are perceived in real-time under each condition.
- Q.Are my selected images saved to a server?
- No, never. This tool is designed to run entirely on the client side (within your browser). Your image data is physically never sent to any external server. You can safely use it even for highly confidential design assets.
- Q.Can I save and share the simulation results?
- Yes. By clicking the "Save Result" button, you can directly save the current simulated output as a PNG image to your device, which is useful for client reviews or presentations.
- Q.What if I just want to check specific color codes?
- Please use the "Color Palette Mode". By simply entering the HEX color code you want to check, you can compare how it looks across all 4 vision types simultaneously in a list format, supporting up to 12 colors at once.
- Q.Does it work on smartphones and tablets?
- Yes, this tool features a responsive design and can be comfortably used on mobile devices like smartphones and tablets. No app installation is required.
- Q.How accurate is the simulation algorithm?
- We utilize a scientific color transformation matrix based on the universally recognized "Brettel Method" (1997). It performs an advanced simulation based on the sensitivity models of L, M, and S cones in the human retina.
- Q.Is it practical as a Web Accessibility testing tool?
- Yes, it is highly suitable for verifying color contrast and distinguishability in web design, UI design, and printed materials. We highly recommend using it for pre-testing to ensure your information is accurately conveyed to users with diverse color vision.
- Q.Can it process very large image files?
- It can process any image within the limits allowed by your browser's Canvas API. However, to maintain performance during in-browser calculations, ultra-high-resolution images are internally optimized in size for the preview (original aspect ratios are maintained when saving).
Use Cases
Web Design Testing
Check if your site's color scheme is distinguishable for users with color vision deficiency.
Chart & Graph Validation
Verify that data visualizations and charts are accessible.
Education & Awareness
Use as an educational tool to learn and deepen understanding of color vision diversity.
Print Material Checks
Simulate color choices for posters, flyers, and documents before printing.
Send Feedback
Please let us know your thoughts to help us improve the tool.
Feedback is temporarily suspended
The server is busy or spam protection is active. Please try again later.