Contrast Checker

Check color contrast ratio

100% private — everything stays in your browser

Foreground

#000000

Background

#ffffff

Sample Text

The quick brown fox jumps over the lazy dog

21.00:1

AA Normal: PassAA Large: PassAAA Normal: PassAAA Large: Pass

How to use Contrast Checker

1
Pick your color — Use the color picker or enter a color value above to get started.
2
Adjust your settings — Use the interactive controls to fine-tune colors, adjust values, or configure options.
3
Copy the result — Copy the generated color codes (HEX, RGB, HSL) or CSS output. Everything runs locally in your browser.