[a11y] Background and foreground colors do not have a sufficient contrast ratio
rjbeers opened this issue · 4 comments
While viewing the mobile styled content, the names of people under "Here's what people are saying about us" are too light against a white background. https://web.dev/color-contrast/ explains the issue in detail.
https://color.a11y.com/ContrastPair/?bgcolor=ffffff&fgcolor=777777 can be used to see how we fail the score for this particular section of the page.
https://www.w3schools.com/colors/colors_shades.asp shows some alternative shades that could be tried.
One can git show cb35676754120281a39de1af2be3eae42a52bb28 for the change that introduced the issue to see relevant code.
I recommend switching the foreground color to #707070. https://color.a11y.com/ContrastPair/?bgcolor=ffffff&fgcolor=707070 shows that is passes. WCAG AAA is notoriously tough to beat. I don't think we need to go that far.
If #707070 can pass the WCAG AA, then assign it to me. I can implement this solution ASAP.
In case it matters, I used a tool called webAim and found that #595959 passes the WCAG AAA test ratio of 7:1. If this meet your needs, then I can implement ASAP.
Here is the url of the tool https://webaim.org/resources/contrastchecker/