What is relative luminance?

Relative luminance is the WCAG-defined measure of the perceived brightness of a color, normalized so that pure black is 0 and pure white is 1. It accounts for the fact that the eye is far more sensitive to green than to red or blue.

Why are the channels gamma-corrected first?

sRGB values are stored in a non-linear, gamma-encoded space. To measure true light intensity you must convert each channel back to linear light. WCAG uses a piecewise transform: divide by 12.92 below the 0.03928 threshold, otherwise apply a 2.4 power curve.

What are the 0.2126, 0.7152, and 0.0722 weights?

They are the standard luminance coefficients for the sRGB/Rec. 709 primaries. They reflect human sensitivity to each primary: green contributes the most light, red is middle, and blue contributes the least.

How do I turn two luminances into a contrast ratio?

The WCAG contrast ratio is (L1 + 0.05) / (L2 + 0.05), where L1 is the lighter color's luminance and L2 is the darker one's. AA body text needs at least 4.5, and AAA needs 7.

Does this match what design tools report?

Yes for the WCAG definition. Note that relative luminance is different from HSL lightness or HSV value, which are simpler, non-perceptual transforms and will give different numbers.

Relative Luminance Calculator

Relative luminance is the foundation of every WCAG color-contrast check. It converts a color into a single number that represents how much light it emits to the eye, so two colors can be compared objectively for legibility.

How it works

Each sRGB channel (0–255) is first divided by 255, then linearized with the WCAG piecewise gamma transform:

c_srgb = channel / 255
c_lin  = c_srgb / 12.92                      if c_srgb <= 0.03928
c_lin  = ((c_srgb + 0.055) / 1.055) ^ 2.4    otherwise

The three linear channels are then combined with the Rec. 709 luminance weights:

L = 0.2126 * R_lin + 0.7152 * G_lin + 0.0722 * B_lin

The result L ranges from 0 for pure black to 1 for pure white.

Using it for contrast

Once you have the luminance of a foreground and a background color, the WCAG contrast ratio is (Llighter + 0.05) / (Ldarker + 0.05). A ratio of 4.5 or higher passes AA for normal text, and 3 is enough for large text. Note that luminance is not the same as HSL lightness: it is perceptually weighted toward green, so a saturated green will read far brighter than a saturated blue of the same nominal lightness.