Skip to content
N NotAtAll
All tools
ENChange language
EnglishEspañolPortuguêsBahasa Indonesia

Color Contrast Checker (WCAG)

Check whether your text is readable: pick a text and background color and get the WCAG 2.1 contrast ratio instantly, with pass/fail for AA and AAA at normal, large and UI-component sizes. A live preview shows exactly how the pair looks.

🔒 100% private — files never leave your browser

Contrast ratio

—

Normal text — the quick brown fox jumps over the lazy dog.

Large text sample 24px

AA: 4.5:1 normal · 3:1 large (≥18pt or ≥14pt bold) · AAA: 7:1 normal · 4.5:1 large.

How to use the WCAG Contrast Checker

  1. 1 Pick the text color and background color (or paste HEX codes).
  2. 2 Read the contrast ratio and the AA / AAA verdicts for normal text, large text and UI components.
  3. 3 Tweak until the pair passes — the live preview shows the combination at real sizes.

Frequently asked questions

What contrast ratio do I need?

WCAG 2.1 requires 4.5:1 for normal text (AA), 3:1 for large text (18pt / 14pt bold, AA) and 7:1 for the strict AAA level. UI components and graphical objects need 3:1.

How is the ratio calculated?

The relative luminance of each color is computed with the WCAG formula (sRGB linearization, then a weighted sum) and compared as (L1 + 0.05) / (L2 + 0.05). The math runs locally as you type.

My pair fails — what can I change?

Usually the fastest fixes: darken the text color, lighten the background (or vice versa), or increase the font size so the 3:1 large-text threshold applies. The tints/shades in the Color Converter tool help you find a passing neighbor quickly.

More free tools

Color Converter Convert colors between HEX, RGB and HSL instantly. Pick or paste any format, copy all of them, and explore tints and shades — fully client-side. Color Palette from Image Extract dominant colors from any image into a palette you can copy as HEX or RGB. Click the image to pick exact pixels — all local, no upload. YouTube Thumbnail Maker Create a 16:9 YouTube thumbnail with custom title, subtitle, colors and background image. Export a crisp 1280×720 PNG directly in your browser. Favicon Generator Generate favicon PNGs, an SVG favicon and a web app manifest from text, emoji or an image. Free, private and processed in your browser.