Low Contrast Text on Webpage

[ghost]

Feature Request

Use Case/Motivation

https://contrastrebellion.com/

Example Usage

color: #000 in div.flex

Other information

[wren]

Hi, @klorophatu! Thanks for reporting this. Accessibility is important.

Could you please give some more specific details about which parts of the website don't have enough contrast? Some screenshots, if you have them, would also be very useful.

[wren]

Scanning jrnl.sh with a11y shows this:

For the failed results:

1. At a quick glance, I don't see where there's any white text on light grey background. So, I'm guessing this is some quirk in the scan. Maybe some bg property we're not setting correctly?
2. This is the grey text on grey background, which is absolutely not enough contrast, and I'm guessing what the OP was about. Should be an easy fix, though.

[wren]

For the other pages (this one is from overview):

It looks like our blue link color is close, but just shy of the contrast requirements. We should pick out a slightly more contrasty blue.

[wren]

Ouch, I won't paste the results here (because they don't fit on my screen for a screenshot), but our syntax highlighting has a lot of problems (scan https://jrnl.readthedocs.io/en/latest/formats/ with the tool linked above).

[wren]

Also, since I'm just spamming this thread apparently, are there are good ways for us to automate these tests? Maybe it's not worth automating since we don't change our colors often, but if it's simple, it could streamline site updates in the future.

[wren]

cc #1005

[wren]

You can view this now here: https://jrnl.sh/en/latest/

With the next release, it'll be merged into the stable channel, and will be the default for everyone.

Thanks, again for pointing this out, @klorophatu!