Color Contrast Checker

Posted on Monday, 13 January 2020 by Brad Henry

Overview

TPG’s appropriately named Colour Contrast Analyser (CCA), is our color contrast checker tool that allows you to easily determine the contrast ratio of two colors. The CCA enables you to optimize your content–including text and visual elements–for individuals with vision disabilities like color-blindness and low-vision impairments.

Features

  • Compliance indicators for Web Content Accessibility Guidelines 2.1 (WCAG 2.1)
  • Multiple ways to select colors: you can manually enter CSS color formats, use an RGB Slider, or opt for the color picker tool
  • Color Blindness Simulator
  • Support for alpha transparency on foreground colors

WCAG Color Contrast

The web content accessibility guidelines (WCAG) define the different levels of contrast ratios depending on the level of success criteria. Below is helpful information for comparing the results from our tool to the level of success criteria you hope to achieve. Learn more about WCAG color contrast.

  • WCAG 2.0 level AA requires a contrast ratio of at least 4.5:1 for normal text and 3:1 for large text.
  • WCAG 2.1 requires a contrast ratio of at least 3:1 for graphics and user interface components.
  • WCAG Level AAA requires a contrast ratio of at least 7:1 for normal text and 4.5:1 for large text.

Need Additional Color Contrast Help?

Evaluating your design for color contrast is a critical aspect of accessibility testing and organizations may benefit from appropriate user experience training and expertise to ensure proper contrast. While our color contrast checker is one of the best tools that allows you to determine contrast levels on your own, we would love to help you with your next project. Our accessibility and user experience experts have the skills required to ensure your next project meets your accessibility goals.

We can help you determine the appropriate success criteria, develop a roadmap to achieve your goals, and provide expert support along the way. Contact us today to discuss why you are looking for our color contrast checker or see if we can help with other aspects of your accessibility projects.

Support and development

If you have any questions concerning our color contrast tool, would like to report bugs or suggest improvements, or contribute to the code, see the Colour Contrast Analyser (CCA) repository.

Previous versions

The current version of the Colour Contrast Analyser (CCA) has been rebuilt from the ground up using Electron. For the previous, non-Electron versions (“CCA Classic”), see the CCA-Win and CCA-OSX repositories.

This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for more details.


Need help with your specific accessibility needs?

Contact Us

Comments

Comments for this post are closed.