Color Contrast Checker
Check the contrast ratio between foreground and background colors against common WCAG thresholds.
About this tool
What is Color Contrast Checker?
Measure the contrast ratio between a foreground color and a background color. The checker reports the calculated ratio and indicates whether the combination meets common WCAG contrast thresholds for normal and large text at AA and AAA levels.
How to use
Get your result in a few steps
- 1
Choose or enter a foreground color.
- 2
Choose or enter a background color.
- 3
Click 'Run Tool'.
- 4
Review the contrast ratio and AA/AAA pass or fail results.
Frequently asked questions
Questions about Color Contrast Checker
What contrast ratio does WCAG use for normal text?
The tool checks the commonly used thresholds of 4.5:1 for normal-text AA and 7:1 for normal-text AAA.
What contrast ratio does the tool use for large text?
The tool checks 3:1 for large-text AA and 4.5:1 for large-text AAA.
Does passing a contrast check guarantee full accessibility?
No. Contrast is only one accessibility consideration. A complete accessibility review includes many additional requirements.
Keep exploring
Related tools
CMYK to RGB Converter
Convert CMYK percentages to approximate RGB color values.
Color Converter
Convert a color between HEX, RGB, HSL, and CMYK formats.
Color Palette Generator
Generate complementary, analogous, triadic, tetradic, split-complementary, or monochromatic color palettes.
Color Picker
Pick a color visually and instantly view its HEX, RGB, HSL, and CMYK values.
CSS Gradient Generator
Create a two-color CSS linear gradient and copy the generated background declaration.
HEX to HSL Converter
Convert hexadecimal color codes to HSL hue, saturation, and lightness values.