LocalSEOTrack
Home/ Tools/ Color Contrast Checker

Color Contrast Checker

Enter foreground and background colors to calculate their contrast ratio. Tests against WCAG 2.1 Level AA and AAA standards for normal text, large text, and UI components.

How to Use

  1. Enter or pick the foreground (text] color.
  2. Enter or pick the background color.
  3. Review the contrast ratio and WCAG pass/fail results.
  4. Adjust colors until you meet the desired accessibility level.
Large Text Preview
Normal text preview - The quick brown fox jumps over the lazy dog.
21:1
Contrast Ratio
-
AA Normal
-
AA Large
-
AAA Normal
-
AAA Large

Learn More