APCA Contrast Calculator

How to use

1. 1Enter the text color and the background color as HEX, rgb(), or hsl(), or pick them with the color swatches.
2. 2Read the Lc value and tier badge on the right. Positive Lc means dark text on light background; negative means light text on dark.
3. 3Set the font size and weight you plan to use to compare against the APCA Bronze readability minimum.
4. 4Edit the preview text to see your real copy rendered with the chosen colors, size, and weight.
5. 5Use Swap colors to flip polarity, or Copy report to paste the full result into your design notes.

About this tool

APCA Contrast Calculator computes the Accessible Perceptual Contrast Algorithm (APCA) Lc value between a text color and a background color. APCA is the perceptual contrast measure under consideration for WCAG 3 (Silver) and is recommended for modern light-on-dark and dark-on-light interfaces where the older WCAG 2 ratio breaks down. The tool accepts HEX, rgb(), and hsl() input on both sides, including 8-digit HEX and rgba/hsla with alpha (transparent colors are composited over white before the math runs). The reported Lc value is signed: positive values mean dark text on a light background (BoW polarity), negative values mean light text on a dark background (WoB polarity). The implementation follows the public APCA-W3 0.98G-4g reference: each sRGB channel is linearized with the 2.4 transfer curve, blended into screen luminance Ys with the 0.2127, 0.7152, 0.0722 coefficients, soft-clamped against black at the 0.022 threshold, and then SAPC is taken as the polarity-aware difference of the normBG/normTXT or revBG/revTXT exponents, scaled by 1.14 and floored at the 0.027 noise offset. The result panel shows the rounded Lc value, the precise float, polarity, and a tier badge (best for body text, preferred body text, body text minimum, headlines, large or non-content, not for text, invisible) so designers know at a glance whether a pair is readable. A font size and weight selector applies the official APCA Bronze readability table to tell you whether the pair passes for that specific size and weight. A live preview swatch renders sample text at the selected size and weight using the chosen colors. Color pickers, free-form HEX or function inputs, swap, reset, and copy report controls make iteration fast. Everything runs locally in your browser; no colors, presets, or settings are uploaded.

Free to use. Works in your browser. No signup, no login.