Suggestion: don't use pitch black as a background or text

[stackingsaunter]

I suggest not using pitch black neither for background in dark theme nor for text in the light one.

Even though they offer the best possible contrast ratio, from my experience and a bit of research a slight tweak in the pure #000000 black makes it more readable and causes less eye strain. Here's some comparison to #121212 tainted black:

Here´s Figma file where you can see comparison in detail

I think the most contrast version of pure black/pure white will be better than tweaked version for people with certain visual impairments, but for any other will be suboptimal. Perhaps there should be a separate enhanced contrast theme for users with those impairments?

Some links for reference 1, 2, 3, 4

[Bosch-0]

Completely agree, when I stare at white text on a pure black background and stare away I get those trailing spots in my vision. A more pastel black like the one you showed above is much better.

Subjectively I think it looks better to

[GBKS]

Gotta love color contrast discussions. Here's a counter opinion where someone pushes hard for pure black and white. I'm also more on the "shades of gray are OK" side of things.

As far as a "separate enhanced contrast theme", operating systems offer accessibility options that let users increase contrast, make text bold, and increase text size. Applications and websites can also pick up those options and adjust accordingly, so this does not have to be a separate theme users have to enable.

I assume you are only referring to titles and labels, as other text is already grey (ignore the console mock-up, that is a rough draft). My thoughts are pretty much inline with this paragraph from the UX Movement article you linked to.

There are times when white text on a dark background works well. This is when users are scanning text. Users typically scan headings, titles and labels. Using white text on a dark background for these types of text is an effective way to highlight them to grab user attention. White reflects all the colors of the visible light spectrum into the eyes [source]. This makes the text bright and distinct. You won’t have to worry about putting stress on the user’s eyes because scanning doesn’t take long visual fixations. All it takes is a quick sweep of the eyes to scan a heading, title or label. Using white text on a dark background as a highlighting tool is a smart way to call out text that users scan. But black text on a light background is better suited for paragraph text that users read. Apply dark and light colors correctly so that users can enjoy your content without getting an eye ache.

I don't think people stare for long times in this application, like they would do in a coding or writing tool. They scan the screens fairly quickly, find what they are looking for and move on. So I don't see a general issue with the color choices. The only people who stare at these designs intensively for longer periods, are probably we because we work on them.

To me, that leaves this more in the subjective realm of discussion. I find the difference between #000000 and #121212 barely noticeable in my current environment (morning time, well lit room, comparing on a Dell monitor, a MacBook Pro monitor and an iPhone screen). This might be slightly different in a very dark room. Basically, I don't have a strong subjective opinion here. If this is something you'd like to do, maybe ask a few more people, and ensure to consider the whole color system.

[stackingsaunter]

Thanks @GBKS and @Bosch-0, gonna explore this topic and try to dive deeper and try to ask broader audience to gather more subjective feedback as well

[stackingsaunter]

Here's a counter opinion

As far as I can see this article relates only to dark text on white background. I think it does not has to work the same way with white text on the black background. I'd love to know @Myndex opinion on this. Seems like APAC guidelines have nothing agains such set.

Makes me think why it's so rarely used then. Almost none of the big tech uses pitch black in dark themes, at least not as a background, including Github.

It's actually quite hard to find any good sources or research on this topic. I failed to find anything on WCAG, but it's quite a stretch to look there.

I found a nice explanation of the "blending" effect I have while reading white on pure black:

Seems to be the halation effect, used in popular illusions such as this one below

[Myndex]

There is a lack of research in this area, but it is an area we are researching.

The issue is more complicated though than simply the background color, and there are other important considerations including the ambient and surrounding proximal field, and the peak lightness/brightness of the lightest element(s).

[Myndex]

And for the record, the examples on the right with the black are easier for me to read than the ones on the left. And an important takeaway is that os user customization. For instance, for darkmode on GitHub, I use the "high contrast" version which puts the black very close to black.

If black is ideal or not is dependent on enough factors that you can't make a "blanket statement" as to suitability of use.

[stackingsaunter]

Thank you @Myndex for your input. If you ever find out something interesting, we'd love to read it!

To summerise, it seems it's impossible to determine whether pure or tainted black is better or more universal for dark theme background, at least not for the moment. Thus I'm closing this issue for now

[Myndex]

Hi @jakubszwedo Yes it is challenging... PERSONALLY, I do recommend lifting the blacks slightly, but IMO it is more important to consider the TOTAL contrast of the design.

The Myndex sites use an auto dark mode design, experimental, but intended to illustrate this. I am working on an article for publication in a couple months on the issue, including some of the preliminary research.

See: git.myndex.com