Color Contrast Checker

Check the WCAG contrast ratio between a text color and background color, with AA and AAA pass/fail results.

Your file is processed locally in your browser and is not uploaded to our server.

Text color: #f5f7fa

Background color: #0b0f14

The quick brown fox jumps over the lazy dog

Sample text at normal size

AA — normal text (4.5:1)

AA — large text (3:1)

AAA — normal text (7:1)

AAA — large text (4.5:1)

How to use Color Contrast Checker

1Pick a text (foreground) color and a background color.
2The WCAG contrast ratio is calculated, along with pass/fail results for AA and AAA compliance.

WCAG AA requires 4.5:1 for normal text and 3:1 for large text (18pt+); AAA requires 7:1 and 4.5:1 respectively.

Developer

Preview an image under simulated color blindness.

Developer

Generate a formatted list of file names, sizes and types.

Developer

Generate shades, tints and tones from a base color.

Developer

Add a prefix/suffix or change extension across many files.

Developer

Generate complementary, analogous or triadic color schemes.