Color Contrast Checker

Level AA asks for 4.5:1 on normal body text and 3:1 on large text and UI components, while AAA raises text requirements to 7:1. The five badges show every verdict at once, so you never have to memorize the table.

It uses the WCAG relative luminance formula: (L1 + 0.05) divided by (L2 + 0.05), where L1 is the lighter color's luminance. Results range from 1:1 for identical colors up to 21:1 for pure black on pure white.

Contrast is driven almost entirely by lightness, not hue, so two vivid colors can still be unreadable together. The suggestion feature keeps your hue and only shifts lightness, which is usually the least painful fix a brand team can accept.

Yes. Press Upload image and the tool extracts up to eight dominant colors from the file, entirely in your browser. Each swatch has T and B buttons that load it as the text or background color for testing.

It does. WCAG 2.1 criterion 1.4.11 requires 3:1 for UI components and graphical objects, and there's a dedicated badge for that threshold. The preview even renders an outlined button so you can judge the result visually.

Yes. Text at 18pt and up, or 14pt bold, only needs 3:1 at Level AA because bigger strokes stay legible at lower contrast. The tool reports large text separately so a passing headline never masks a failing paragraph.

Hex codes, rgb() strings, and standard CSS color names all parse. Invalid input gets flagged under the field immediately, so a typo can't silently produce a wrong ratio.

Fully private. Ratios are computed with JavaScript on your machine, and uploaded images are read on a local canvas that never leaves the page. Nothing is stored or transmitted.