WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Colour contrast measurement techniques

for

From: glen walker
Date: Feb 17, 2023 4:41PM


If available, I always go to the CSS to get the real color value. However,
if the CSS color also uses opacity (the 4th parm when using rgba) (I think
Steve alluded to this when he said "text is viewed through a translucent
layer"), then I'll look at the rendered color.

Sometimes I'll use a color picker if I'm in a hurry and just need a rough
estimate of the ratio. As Patrick inferred, if the ratio is way off from
4.5:1 (or 3:1), then it doesn't matter if I have it exactly right. Only
the borderline cases need a more exact number, although in border cases, if
the contrast was 4.4, which technically fails, making the color 4.5 will
probably not make much of a visual difference.

When trying to snag the color from the rendered text, I often zoom to 200%
or bigger and try to get a "straight line" character that has less
anti-aliasing. For example, a capital H or the left side of B or b. Any
letter that has a long straight section. I never snag from the curved part
of a letter because that has the most anti-aliasing.