Accessibility: Color Contrast Resources

Eight Ishihara charts for testing colour blindness

Curious if the color in a graphic or text has enough contrast to be accessible to those with low vision or color blindness? If so, there are a few free online resources to help you out.

The WCAG Color Contrast Checker, which you can use directly on their website or bookmark it, and the TPGI Colour Contrast Analyzer, which can be downloaded, are fairly easy to use. For either one, just use the “eyedropper” tool to grab a color from a document, webpage, etc. and it will provide you with the color contrast ratio and “pass” or “fail” results. Additionally, WAVE is a web accessibility evaluation tool in which you enter the website that you are interested in testing and it will locate any color contrast errors, in addition to other accessibility measures.

If you have full color vision and would like to see for yourself how a website looks to someone who is colorblind, then try Coblis or Let’s Get Color Blind. Let’s Get Color Blind is a browser extension for Chrome or Firefox. It simulates reduced sensitivity to green, red, or blue for an entire webpage. If you are interested in testing a specific image, then try Coblis (The Color Blindness Simulator), which simulates reduced sensitivity and blindness for green, red, or blue as well as full-color blindness. 

I discovered these resources from Guide to Digital Accessibility (Ed. Mancilla & Frey, 2023, ISBN-13: 978-1-64267-453-8). Learn more about color contrast from MSU’s Digital Accessibility.

Feature Image: “Eight Ishihara Charts for Testing Colour Blindness” by Fae licensed under CC BY 4.0 DEED.