Color Contrast Analyzer

The Color Contrast Analyzer (CCA) assists in evaluating the readability of text and the difference in contrast between visual elements, including graphical components and visual cues.

Contrast Ratio:  

WCAG Results

  • 1.4.3 Contrast (Minimum) (AA)

  • 1.4.6 Contrast (Enhanced) (AAA)

  • 1.4.11 Non-text Contrast (AA)

Get Color Recommendations

Suggestion 1

Color Contrast ratio

Suggestion 2

Color Contrast ratio

Explanation

Please input both foreground and background colors in the RGB hexadecimal format (e.g., #FFFFFF or #5F4190), or alternatively, select a color using the provided color picker tool.

Compliance with WCAG 2.0 level AA standards necessitates achieving a contrast ratio of no less than 4.5:1 for regular text and 3:1 for text of a larger size. WCAG 2.1 guidelines extend the requirement to graphics and user interface elements, such as form input borders, necessitating a minimum contrast ratio of 3:1. For adherence to the more stringent WCAG Level AAA standards, a contrast ratio of 7:1 is mandated for normal text, and 4.5:1 for larger text.

Larger text, as per the WCAG standards, is specifically defined as text that is 14 points (typically 18.66px) or larger and bold, or text that is 18 points (typically 24px) or larger.