Free WCAG color contrast checker: test text and background colors for AA and AAA compliance in your browser. Enter hex or rgb values, see the contrast ratio and pass/fail instantly. No login, no upload.
It computes the WCAG 2.x contrast ratio between a foreground (text) color and a background color using sRGB relative luminance. You get a numeric ratio (for example 4.52:1) plus pass/fail for WCAG AA and AAA thresholds on normal text and large text. It is a design QA helper—not a full automated accessibility audit of your entire site.
Hex (#RGB, #RRGGBB, #RRGGBBAA), rgb(), and rgba(). Paste brand palette values from Figma tokens, CSS variables, or design docs. Short hex like #fff expands to #ffffff before luminance is calculated.
AA is the common legal and product baseline: 4.5:1 for normal text, 3:1 for large text. AAA is stricter: 7:1 normal, 4.5:1 large. Many marketing sites target AA for body copy and AAA only for hero headlines or high-risk UI. This tool shows both so you can pick a defensible target with design.
Large text is at least 18 point (24 CSS px) regular weight, or at least 14 point bold (about 18.66 CSS px). Buttons, captions, and fine print often fail AA even when headings pass—check every size you ship, not just the H1 swatch.
No. Parsing and luminance math run entirely in your browser. Unreleased palette experiments and client NDA colors stay on your device. Clear fields on shared machines when finished.
rgba and #RRGGBBAA values are parsed, but contrast is evaluated on opaque sRGB channels—the checker does not alpha-composite text over photographic backgrounds. For text on images, sample the effective color behind the copy or use a solid overlay first, then re-check.
Yes. Free with no login for the core ratio and pass/fail path.