WebAIM - Web Accessibility In Mind

E-mail List Archives

Color Contrast and Gradients

for

From: David Ashleydale
Date: May 22, 2012 9:57AM

Hi,

Do any of you have any tips on color contrast considerations when a piece
of text's background color isn't solid, but is a gradient? Off the top of
my head, I was thinking that I could just measure the contrast at the
highest and lowest points of the letters and ensure that the contrast is
sufficient there. Or perhaps I could just do the midpoint of the text? Does
WCAG have anything to say about this? I looked around in the "How to Meet"
section for this particular guideline, but didn't see much about gradients.

BTW, in case it matters, this would not be an image of text -- it would be
regular HTML text. Although, I haven't decided whether to use an image for
the gradient background or CSS.

Thanks,
David