Open zmitchell opened 8 months ago
I think this should get reshaped into "run the axe plugin on floxdocs and make accessibility updates where we are weak" and not be planned as a bug
I just ran axe
on the page and 33 out of 43 issues were related to text contrast
looks like it's just triggering on the pink text and not the gray text though. and only in light mode. would be good to update this ticket with the findings from the plugin
@garbas do you know if we can pick different theme colors in light mode vs. dark mode? the main contrast issue is pink on white and it's really close to passing the contrast muster. we would want to pick a darker rose
color from the brand guidelines for lightmode and, ideally, keep the current working color for dark mode.
cc @rossturk
Everything is possible to change, I think I chose the initial color from the design documents. I would only need somebody to select colors and then ping me to implement a change, it should be a fast change once we know which colors we want.
brand color to try in light mode only #E5006E
we should also try to address the other points from the plugin (there's a small handfull)
The current light mode body text is #666666, which has a contrast of 5.74 against the white background #FFFFFF. This passes the WCAG AA threshold of 4.5, but it fails the WCAG AAA threshold of 7. If we just use the brand color #1B1B1B for body text (the same color we use for the header) the contrast jumps to 17.2.
You can play around with contrast in this color checker: https://webaim.org/resources/contrastchecker/
Acceptance Criteria
#E5006E
#1B1B1B
from#666666
Original issue
The current typeface color is a mid-gray on a white background, which gives the text low contrast against the background. Low contrast is hard on people with poor eyesight. We should make the body text closer to black to make it easier to read.