Color Contrast Checker

Enter a foreground and background hex color to get the WCAG contrast ratio and pass/fail result.

Updates instantly as you type

01 / Fast steps

  1. Enter the foreground (text) color as a hex value.
  2. Enter the background color as a hex value.
  3. Read the contrast ratio and WCAG pass/fail results instantly.

02 / Best for

  • Checking whether body text is readable against its background.
  • Validating a color palette against WCAG accessibility guidelines.
  • Comparing a few color combinations before committing to a design.

03 / Keep in mind

  • Only accepts hex colors (3 or 6 digits), not named colors or rgb() values.

faq

Questions, answered.

01What contrast ratio do I need?

WCAG AA requires at least 4.5:1 for normal text and 3:1 for large text. AAA requires at least 7:1 for normal text and 4.5:1 for large text.

02Is my color data sent anywhere?

No, the contrast ratio is computed entirely in your browser.

03Is Color Contrast Checker free to use?

Yes, Color Contrast Checker is completely free, with no sign-up and no usage limits. It runs entirely in your browser, so your data never leaves your device.