ColorPairLab4 entries
Color and Contrast Guides
Understand WCAG text contrast, normal and large text, CSS color names, and how tints and shades are made. Each guide includes examples to try.
Get the reasoning behind a contrast result, color name or generated shade.
CSS Color Names vs. Everyday Color Names
A CSS keyword identifies an exact color. A palette name or an everyday description may not. Here is how to keep the two clear.
Contrast Ratio Rounding: Why 4.48:1 Fails AA
A rounded number makes a ratio easier to read. It cannot turn a value below the WCAG threshold into a pass.
How Tints, Shades and Related Hues Are Calculated
Tints move a color toward white, shades move it toward black, and hue rotations offer related colors to try. Each step uses the same repeatable calculation.
WCAG Text Size and Contrast Thresholds
The size of the lettering decides whether a pair needs the normal- or large-text contrast threshold. Button padding and card size do not count.