For the past years, everyone liked the idea of the so-called “dark mode.” It enables us to do things in dark surroundings (and even extends battery life).
Now what makes a good dark interface is that it’s not only inverting colors. It involves careful guidelines for designers to follow. I’ll uncover some of them in this article, be sure to remember them the next time you’re designing.
When you don't know where to begin, get inspired by different platform guidelines that are available. Here are some you can get inspiration:
One of the common mistakes in dark mode is using pure black (or #000). Try to stick with a very dark tone of your preferred color, like blue.
Although, this tip isn't mandatory for “very dark mode” and for OLED screens. As long as you're using a dark background, you're fine.
Another common mistake is using pure white (or #fff). It can create a huge contrast with the background, so it’s better to use off-white like #fafafa.
Saturated colors are avoided at all costs for accessibility. Optical vibrations may produce therefore causing eye strain. Try desaturating the colors by 20-25%.
Shadows are perfect in “light mode” for creating elevation. However, they aren’t visible, and may not look good, even if it’s 100% black. Instead, make elevation by altering the opacity of white.