Do I have to add a dark mode now?

Drawbacks of adding a dark mode to an app or website

Why I thought it was silly to add a dark mode? Well, Apple added one to the previous MacOS updated and that caused this small hype among designers. That version didn’t have other interesting features, so I felt Apple’s developers were caught up in more important things not yet ready for release. Like when the most notable new feature of the new iPhones was that they came in new colors. My skepticism was only supported by Apple presenting dark mode as just an aesthetic choice for users. It didn’t help that I generally prefer light UIs.

A major drawback of adding a dark mode to a user interface is of course that it takes time. I guess I spent already around 8 hours of design and implementation for the dark theme of this small website. Granted, I had to figure out things you don’t have to after reading this post. On the other hand, this being my personal website, things usually go faster than in a professional context. I don’t regret having spent so much time on it though—it was fun to do. But in a commercial context, that doesn’t mean much.

There’s not just the initial time investment of adding the theme—every future change to the design has to work well in both themes. On top of the additional design work, testing and quality assurance requires significantly more effort.

Another argument against theming of a UI is that it can reduce recognizability. Amazon wouldn’t look like Amazon with a black background on their website.

Related to that: a dark mode may not fit with the emotions an existing, light design should evoke. That design may be tied to well-thought-out branding guidelines about lightness, clarity and sunshine. You know how brick-and-mortar stores are even brightly-lit during the day? Imagine they’re open at night, but turn off most of the lights, because, you know, dark mode.

Benefits of adding a dark mode

Dark UIs can have several benefits over a light one:

• It can help not messing up users’ circadian rhythms when used late in the evening.
• When used in a dark environment, users’ eyes don’t have to readjust after looking at it.
• Dark backgrounds can move attention away from the design itself and toward the visuals it presents.
• They let AMOLED displays use a little less power.

But wait a minute—if the above applies, perhaps the UI should be dark already! So what reasons are there for adding an additional dark theme?

• The product is used both in dark and light environments. Reading applications and devices are examples of that.
• The UI should appear responsive to its use context. In fact, it should not just have a light and a dark mode, but also modes for, say, early morning, noon, late afternoon, party, apocalypse and gardening.
• Integration with the operation system. Now MacOS has a light and a dark mode, some may be disappointed if your application doesn’t support it.
• It can be a good exercise to reconsider (simplify!) the UI’s color palette and improve the consistency of how colors are applied.

Not a list of strong arguments, huh? There’s one more though: accessibility.

Accessibility

I used to believe that from an accessibility point of view, dark mode is bad. Many people, especially those with astigmatism find light text on a dark background hard to read. To the point that it significantly reduces their reading speed. But again, we’re discussing adding a dark mode for users to select.

Via CSS Tricks I found Charles Reynolds-Talbot making a compelling case for why all websites should have a dark mode. He describes how for people with Usher syndrome or astigmatism (sidenote: Yes, astigmatism is used in arguments in favor and against both light and dark UIs. I believe one can be preferred over the other depending on the brightness of the display and the environment. I can imagine that those who have severe astigmatism would feel strongest about having the choice. ) white backgrounds can make text hard to read: it glares over the dark text so much, that it’s obscuring letter forms. I suspect that is the reason for many people saying they can’t read long texts from a display. According to the paywalled paper linked from the Wikipedia article about astigmatism 30–60% of people have astigmatism.

Summing that up: many people may not care, but some strongly prefer a dark or light theme, just so they can read well. Giving the users the choice between a light and a dark mode can make a big difference for them.