styled-components / polished

A lightweight toolset for writing styles in JavaScript ✨
https://polished.js.org/
MIT License
7.6k stars 209 forks source link

Website contrast prevents readibility #635

Open pixelass opened 1 year ago

pixelass commented 1 year ago

The website is hard to read and several sections have a contrast that it is even hard to read for people with good vision. Lighthouse reports every element on page. A11y checkers can help find out which color's don't meet the standards. Please consider supporting basic a11y over design to allow people with visual impairment to understand the content. Also consider using different colors than red/green as these are commonly colors that many people have issues with (especially at similar luminance)/

What You Are Seeing

Screenshot 2023-03-01 at 09 50 29

Screenshot 2023-03-01 at 09 51 39 Screenshot 2023-03-01 at 10 01 53

What You Expected To See

Higher contrast so that I can read the contents of the page No red/green contrasts

Reproduction

Contrast checker

  1. Go to https://color.a11y.com/Contrast/
  2. Enter https://polished.js.org/
  3. Check the issues (see screenshot above)

Lighthouse

  1. Open the page in Chrome
  2. Open the devtools
  3. Run lighthouse
  4. Check the issues (see screenshot above)