One of the easiest ways to start adding accessibility to an interface is to start paying attention to the contrast between the background colors and the elements on it.
So, white on white is considered 1:1, the contrast of black and white is 21:1. The minimum allowable contrast in most cases is 4.5:1 - these are the requirements for WCAG 2.1 level AA. There is also level A - it is softer, and level AA - it contains the most stringent requirements.
There are many sites and plugins for checking contrasts, both for the web and for Figma.
Using the rules of the AA level, it is difficult to make airy, translucent interfaces, but you can be sure that the information will be read well on different devices in different lighting conditions and will be available to people with imperfect vision.
For further actions, you may consider blocking this person and/or reporting abuse
Top comments (5)
What plugins would you recommend for Firefox and Chrome?
Contrast Ratio is a pretty good website for testing out various colors! It lets you know the WCAG compliance level as well.
On Chrome I have the axe Devtools plugin, which tests for a variety of accessibility concerns, color contrast among them.
Thanks, Timothy!
I use only Chrome, so I have NoCoffee vision simulator and WAVE Chrome extension
Thanks! I’ll be checking them out on the weekend.