🔬🎓 Colorblind Vision Simulator

Simulate, Enhance, and Verify Colorblind Accessibility — and Prepare Figures for Publication

by Stephen T. Abedon Ph.D.Steve Abedon, Ph.D., has taught well over 100 individual classes and ~10 individual courses over his 30+ years as a college professor. He has over 150 publications, including multiple monographs, and is ranked in the top 1 or 2 percent among researchers of all disciplines worldwide. His research focuses on bacteriophage biology and phage therapy. (abedon.1@osu.edu)

phage.org | phage-therapy.org | biologyaspoetry.org | abedon.phage.org | google scholar | publications

Jump to:   🎨 Simulator  |  ♿ Accessibility  |  📖 Background  |  📷 Image Tools  |  🧮 More Calculators

What is the Colorblind Vision Simulator? This tool has three complementary functions. The Simulator tab previews how any figure image appears to individuals with the most common forms of color vision deficiency, including red-green (deuteranopia, protanopia) and blue-yellow (tritanopia) colorblindness. The Accessibility tab shifts problem colors (reds and greens) toward a colorblind-safe palette, with a slider controlling the degree of shift, with built-in colorblind preview before downloading. The Image Tools tab handles figure preparation for publication: format conversion to TIFF (with correct DPI metadata), PNG, JPEG, or WebP; custom DPI setting; resize (by pixels, percentage, or print size); crop, including suggested crops based on composition and automatic trimming of empty margins; rotate; flip; grayscale conversion; and brightness, contrast, and gamma adjustment. An image loaded in any tab is automatically shared with all other tabs. Everything runs in your browser; no files are sent to any server.

To cite this tool: Abedon, S.T. (2026). Colorblind Vision Simulator. colors.phage.org DOI: 10.5281/zenodo.19764781

colors.phage.org  ·  Abedon’s Books  ·  DOI: 10.5281/zenodo.19764781

How can I improve this page?  contact: colors@phage.org

🎨 Colorblind Vision Simulator

Prevalence: Deuteranopia ~5% males Protanopia ~1% males Tritanopia <0.01% Achromatopsia very rare All simulations show complete (dichromatic) forms.
🖼️

Drop an image file here

or click to browse  ·  PNG, JPG, GIF, WebP, BMP

Original image
Upload an image to begin
Simulated view
Simulated image will appear here
How to use: Drop or select any figure image. Choose a colorblindness type, then click ▶ Simulate. The simulated image appears alongside the original. Click ⬇ Download to save the simulated view as a PNG. To correct the figure colors, use the ♿ Accessibility tab — the image you load here is automatically shared with that tab.
Scan the image for its main colors, then click a swatch to replace that color

♿ Accessibility: Color-Safe Enhancement

This tab shifts red and green hues in your figure toward colorblind-safe alternatives (vermillion/orange for reds; blue-green/teal for greens), while leaving all other colors, luminance, and detail unchanged. Use the slider to control the degree of shift, optionally preview how the corrected image looks to colorblind viewers, then download.

🖼️

Drop an image file here

or click to browse  ·  PNG, JPG, GIF, WebP, BMP  ·  or load one in the 🎨 Simulator tab first

Original (0%) Max (100%)
50%
Original image
Upload an image to begin
Color-shifted image
Click ▶ Apply to preview
How the color shift works: Each pixel is analyzed in HSL color space. Reds (hues ~330°–30°) are rotated toward vermillion/orange (~18°); greens (hues ~75°–165°) are rotated toward blue-green/teal (~165°). All other hues (blues, purples, yellows, neutrals) are left untouched. Lightness and saturation are preserved, so all luminance contrast in your figure is maintained. The slider blends between original (0%) and fully shifted (100%); 50% is the default.

Recommended workflow: Start at 50% → click ▶ Apply → check the CVD preview box to verify distinguishability → adjust slider if needed → download. Output is always the same pixel dimensions as the input.

📖 Background: Color Vision Deficiency and Scientific Figures

What is color vision deficiency?

Color vision deficiency (CVD) results from absent or non-functional cone photoreceptors in the retina. The human eye has three cone types sensitive to long (L, "red"), medium (M, "green"), and short (S, "blue") wavelengths. Deficiencies arise when one or more cone classes is absent (dichromacy) or shifted in sensitivity (anomalous trichromacy).

The most prevalent forms involve L and M cones and are X-linked, affecting approximately 8% of males of Northern European descent but only ~0.5% of females. In a typical scientific audience, roughly 1 in 12 male attendees or readers may have difficulty distinguishing certain color combinations — most critically, red from green.

Types simulated by this tool

  • Deuteranopia — absent M (green) cones; the most common form (~5% of males). Red and green are confused; both tend to appear as shades of yellow-brown or olive.
  • Protanopia — absent L (red) cones (~1% of males). Red appears very dark; green and red are confused with characteristic darkening of long wavelengths.
  • Tritanopia — absent S (blue) cones (very rare, ~0.003%). Blue and yellow are confused.
  • Deuteranomaly — shifted M cones (partial green weakness; ~5% of males). Milder than deuteranopia.
  • Protanomaly — shifted L cones (partial red weakness; ~1% of males). Milder than protanopia.
  • Achromatopsia — complete absence of functional cones (very rare). Vision is entirely grayscale.

Why does this matter for scientific figures?

The red-green color pair is one of the most frequently used in science — stop/go, inhibit/activate, control/treatment, low/high — yet it is precisely the pair most invisible to the most common forms of colorblindness. Journals increasingly require or recommend colorblind-accessible figures. Institutions receiving federal funding in the United States also have accessibility obligations under Section 508 and the ADA that extend to instructional and research materials, making colorblind-accessible figures a matter of both inclusion and compliance.

How the Accessibility tab color shift works

Each pixel is converted to HSL (hue, saturation, lightness) color space and targeted hue rotation is applied to the two most problematic ranges:

  • Reds (hues ~330°–30°) are rotated toward vermillion/orange (~18°) — distinguishable from green by both normal and dichromatic viewers.
  • Greens (hues ~75°–165°) are rotated toward blue-green/teal (~165°) — distinguishable from orange/vermillion even for red-green dichromats.

All other hues and all luminance values are preserved. The strength slider blends original (0%) and fully shifted (100%) values, allowing the minimum intervention necessary. Output is always the same pixel dimensions as the input image.

Recommended colorblind-safe palette

The single most effective strategy is to never rely on color alone as the only differentiating element. Combine color with shape, line style, pattern, or direct labels. Then choose a colorblind-safe palette.

The Wong (2011) eight-color palette:

#0072B2 Blue
#E69F00 Orange (replaces red)
#009E73 Bluish-green
#D55E00 Vermillion
#CC79A7 Reddish-purple
#F0E442 Yellow
#56B4E9 Sky blue
#000000 Black

For two-color stop/go situations, blue + orange is the most reliable replacement for red + green.

Additional tips

  • Use filled vs. open symbols in addition to color for data series.
  • Use solid vs. dashed lines to differentiate curves.
  • Add direct labels to lines rather than relying on color-coded legends.
  • Avoid rainbow/jet colormaps; use perceptually uniform colormaps such as viridis, cividis, or inferno.
  • Check figures in grayscale — if elements are indistinguishable in grayscale, they may also be indistinguishable to colorblind viewers.
  • For heatmaps, use blue-white-orange diverging palettes rather than green-red.

How the simulation works

The Simulator tab uses linear RGB transformation matrices derived from the Vienot, Brettel, and Mollon (1999) dichromacy simulation model. Pipeline per pixel: (1) convert sRGB to linear light (remove gamma); (2) apply 3x3 matrix redistributing the missing cone contribution to remaining cones; (3) re-apply gamma correction. Anomalous trichromacy (deuteranomaly, protanomaly) is simulated by blending 60% of the dichromatic result with 40% of the original. All processing is local — no image data is transmitted to any server.

References

  1. Vienot, F., Brettel, H., and Mollon, J.D. (1999). Digital video colourmaps for checking the legibility of displays by dichromats. Color Research & Application 24:243–252. 10.1002/(SICI)1520-6378
  2. Brettel, H., Vienot, F., and Mollon, J.D. (1997). Computerized simulation of color appearance for dichromats. Journal of the Optical Society of America A 14:2647–2655. 10.1364/JOSAA.14.002647
  3. Wong, B. (2011). Color blindness. Nature Methods 8:441. 10.1038/nmeth.1618
  4. Crameri, F., Shephard, G.E., and Heron, P.J. (2020). The misuse of colour in science communication. Nature Communications 11:5444. 10.1038/s41467-020-19160-7
  5. Machado, G.M., Oliveira, M.M., and Fernandes, L.A.F. (2009). A physiologically-based model for simulation of color vision deficiency. IEEE Transactions on Visualization and Computer Graphics 15:1291–1298. 10.1109/TVCG.2009.113

📷 Image Tools

Format conversion, DPI setting, resize, rotate, flip, crop, and tone adjustments — all in one pass. The Crop section can also suggest crops that follow common rules of composition, and can trim empty margins from figures automatically. The image loaded in the 🎨 Simulator or ♿ Accessibility tab is shared here automatically, or upload independently below.

🖼️

Drop an image file here

or click to browse  ·  PNG, JPG, GIF, WebP, BMP

Drag on the preview to select a crop area, or let the tool suggest one
↻ Rotate & Flip
💾 Output Format & DPI
(embedded in TIFF, PNG, JPEG)
Notes: Rotate/flip buttons apply immediately to the working image and can be undone one step at a time. All other adjustments (crop, resize, tone) are applied when you click ▶ Apply & Preview. The downloaded file is always the same as the preview.

Which format should I use? For most journal submissions, PNG is the best choice — it is lossless, widely accepted, and produces files well under typical per-figure size limits (e.g. 10 MB for Wiley/FEBS journals). TIFF is uncompressed and can be very large (>50 MB for high-resolution figures) — use it only if the journal specifically requires it. JPEG is fine for photographs but introduces compression artifacts unsuitable for graphs and line art. WebP is excellent for web use but not widely accepted by journal submission systems.

DPI and pixel count: DPI is metadata that tells a printer how large to render the image — it has no effect on pixel count or on-screen quality. A 4800×3600 px image tagged as 72 DPI is identical in quality to the same image tagged as 300 DPI; only the pixel dimensions determine sharpness. Most journals require “300 dpi at the intended print width” — for a 7.5″ wide figure that means at least 2250 px wide. At 4800 px wide your figure already exceeds 600 dpi at full page width, so no resizing is needed — just set the DPI tag and export.

TIFF output uses uncompressed RGB/RGBA with correct XResolution/YResolution tags, compatible with ImageJ, Fiji, Photoshop, and journal submission systems.
Suggested crops: Check ✂️ Crop, choose a shape, and click ✨ Suggest crops. Up to four suggestions appear below the preview, best first, each with the reasons it was chosen. Clicking one puts it in the crop box, where you can drag it to a new position or edit its numbers. Here are the three kinds of shape setting. Any shape (the default) leaves the proportions to the tool: it starts from a range of shapes between 1:2.5 and 2.5:1, then nudges each edge in or out for as long as the crop’s score improves, and it also offers a tighter and a looser alternative when those differ enough to be worth seeing. Common shapes limits the tool to the original shape and the familiar ratios in the list, and picks among them. A fixed shape (1:1, 4:5, a custom ratio, and so on) uses only that shape.

Compare all shapes: Shows one thumbnail per shape — Any shape, the original shape, and every ratio in the Shape menu (plus your custom ratio, once you have chosen one) — each with the best crop the tool finds for that shape at the current Tightness. The first card, Any shape, is the tool’s own choice with no limit on proportions. The cards stay in the order of the Shape menu so that each shape is easy to find; ★ marks the best overall, and each card gives its rank by score. Clicking a card puts its crop in the crop box and sets the Shape menu to match.

How the suggestions are made: The tool first builds an importance map of the image (check Show importance map to see it, drawn in the colorblind-friendly viridis colors, where yellow is most important and dark purple least). The map combines four clues: how much each area’s color differs from the image’s average color, the frequency-tuned approach of Achanta et al. (2009); how much it differs from the colors along the image’s edges, which are usually background; how much fine detail it holds; and whether it is skin-toned, using the color ranges of Chai and Ngan (1999). The tool then tries thousands of crops of each allowed shape, size, and position, and scores each on five things: how much of the importance the crop keeps; how much of the image’s area it uses; whether the subject falls on a rule-of-thirds intersection or dead center; whether the crop’s new edges cut through important detail (cutting along the top counts double, because that is where heads usually are); and how much of any skin-toned area it keeps, since skin is often a face. Scoring candidate crops against an importance map follows the approach of smartcrop.js by Jonas Wagner (2014). The rule of thirds places a subject one third of the way in from an edge rather than in the middle; the phrase was first written down by John Thomas Smith in 1797.

Tightness: At the Auto setting (the middle of the slider), a crop keeps growing for as long as each strip it adds holds at least roughly a third as much importance, area for area, as the image does on average. A small subject in a large empty scene therefore gets a tight crop, while an image whose content is spread throughout is barely cropped. Move the slider toward Loose to keep more surroundings, or toward Tight to close in.

Marking the subject: If the suggestions miss what matters, click 📍 Mark subject and then click on the subject in the preview (each click adds another mark). Every suggestion must then include every mark.

Limitations: The tool does not know what anything in the image is. Skin tones are only a stand-in for faces: the tool does not recognize faces as faces (wood, fur, and orange objects can pass for skin, and faces in grayscale images are not detected), nor which way a subject is looking, or where a horizon is, so it cannot leave room in front of a face or level a tilted horizon. Thin, faint subjects (a distant mast or antenna, for example) can be missed. Treat suggestions as starting points.

Trim margins: Removes a uniform border — white, black, any flat color, or transparency — and leaves the padding you choose. The background color is read from the image’s corners, and small speckles such as JPEG compression noise are tolerated. This is mainly useful for figures and graphs exported with extra white space; on a photograph with a cloudless sky or a plain backdrop, it will trim those areas too.

Selection size: The line above the preview gives the selection’s size in pixels and the largest print size it supports at the DPI set under Output Format & DPI. Cropping discards pixels, so a tight crop of a small image may be too small to print sharply.
  1. Achanta, R., Hemami, S., Estrada, F., and Süsstrunk, S. (2009). Frequency-tuned salient region detection. IEEE Conference on Computer Vision and Pattern Recognition (CVPR 2009). infoscience.epfl.ch/record/135217
  2. Chai, D., and Ngan, K.N. (1999). Face segmentation using skin-color map in videophone applications. IEEE Transactions on Circuits and Systems for Video Technology 9:551–564. 10.1109/76.767122
  3. Smith, J.T. (1797). Remarks on Rural Scenery. London.
  4. Wagner, J. (2014). Smartcrop.js: content aware image cropping. 29a.ch; code at github.com/jwagner/smartcrop.js

🧮 Phage Biology, Phage Therapy, and Teaching Calculators

Loading calculators…
Colorblind Vision Simulator — DOI: 10.5281/zenodo.19764781 — phage.org — Version 2026.10.13