Are there current standards or guidelines regarding dark themes / dark modes?

Question

Many people are starting to realize that they prefer what is commonly called "Dark Mode" or "Dark Theme". That is, light text on a darker background.

As such, developers are now scrambling to create dark themes for their websites, applications, and operating systems.

The resultant set of themes represent a hodgepodge of different ideas of what a "dark theme" should look like. Some are pure white (#FFF) on pure black (#000), while others are variations within those two extremes.

I have been creating (and usability testing) dark themes for over two decades now, and consequently have my ideas and experiences on what works best. But are there now any recommended standards or guidelines for how dark to make the dark backgrounds, and how light to make the light text? What about the specific colors to use, as "dark" and "light" come in millions of different hues?

I found this question, but it only addresses contrast, which is not quite what I'm getting at. Contrast refers to relative intensity variability, whereas I am also inquiring about overall levels of brightness as well as color hues.

Answer 1

I think the most thorough guidelines you're gonna find are via the big companies with the UX departments that can dedicate their time to writing guidelines.

So like Mihnea mentioned, here are some of those guidelines:

• Apple's MacOS Dark Mode Guidelines
• Apple's iOS Dark Mode Guidelines
• Google's Dark Theme Guidelines
• Honorable Mention: CSS-Tricks's A Complete Guide to Dark Mode on the Web

Answer 2

Are there any recommended standards or guidelines for how dark to make the dark backgrounds, and how light to make the light text?

The standards are generic guidelines and sometimes we need our own design guidelines, especially when it comes to colors.

A simple exercise to get a specific dark or light color is to get the off-black and off-white colors from the basic color range from the web you are working on.

• Off-black: very low value colors, close to black
• Off-white: very high value colors, close to white

What about the specific colors to use, as "dark" and "light" come in millions of different hues?

This answer shows a method on how to obtain colors close to black or white starting from a given color scheme in a practical way.

Answer 3

Yes, there is! The gold standard:

Material Design : https://material.io/design/color/dark-theme.html#usage