Color Contrast Checker

Check WCAG contrast ratios between text and background colours.

Developer Toolscolor contrast checkerwcag contrastaccessibility contrast
1

Input

#635BDB
#635BDB
2

Result

Your result will appear here

How to use

  1. 1Pick the text colour and background colour.
  2. 2Run the checker.
  3. 3Aim for at least 4.5:1 for normal text and 3:1 for large text.

FAQs

What ratio should I target?

WCAG AA requires 4.5:1 for normal text, 3:1 for large text and 3:1 for UI components. AAA requires 7:1 for normal text.

Related Tools

See all

Color Converter

Convert between HEX, RGB and HSL.

Developer Tools

Color Picker

Pick a color and get HEX/RGB.

Image Tools

Web Color Tester

Preview a color.

Web Tools