Color Contrast Checker

Foreground
Background
Coco Mojo Contrast Checker Logo

Check your colors for WCAG 2.0 AA contrast compliance.

Web Content Accessibility Guidelines (WCAG) 2 defines contrast requirements to ensure readability for users with visual impairments. The guidelines specify minimum contrast ratios between text and its background.

AA Compliance

  • Normal Text (less than 18pt/24px): Minimum contrast ratio of 4.5:1
  • Large Text (at least 18pt/24px or 14pt/18.66px bold): Minimum contrast ratio of 3:1
  • Graphical Elements (icons, charts, diagrams, etc.): Minimum contrast ratio of 3:1

Exceptions

  • Logos Text that is part of a logo or brand name has no contrast requirements.
  • Disabled Elements User interface components that are disabled or not available have no contrast requirements.

Adhering to these ratios helps ensure your content is accessible to a wider audience. Use this tool to check if your color choices meet the AA compliance level for normal and large text.

This tool does not address AAA or A levels. You can read more about WCAG 2 at https://www.w3.org/WAI/standards-guidelines/wcag/

 

Smooth.