Ask HN: How did dark mode win?

I always thought it was because dark mode is generally better on the phone battery.

I have never understood why companies spend so much effort to maintain two themes in their web apps or mobile apps. At least for developers I finally found a good explanation:

Why do developers prefer the dark theme? Because the light attracts bugs.

Google Maps is one case where I don't think it's frivolous. It's often used as an in-car guidance app, and driving at night you really do want more than just turning down the brightness.

That's a solution that seems to work for every other app I use, and the phone does it for me. I try to avoid custom modes of anything as much as I can. I prefer the default-case experience, which is usually the best optimized and least likely to get me into a situation I can't get out of.

The impression I get is that developers are noisy about it, and since they're the ones in the room, their voices get heard. Other users who want different forms of accessibility don't attract as much attention and so it's not top of anybody's backlog.

i struggle when reading pages that only have dark theme as it hurts my eyes which is really annoying, glad firefox has reader mode

As you get older, your corneas will begin to blur light into dark areas, at that point it is almost impossible to read black text on a white screen.

Dark mode makes it possible to see far smaller things than you can see otherwise. This is particularly important on phones with their tiny screens, or when doing things with lots of details, no matter how big the display.

The default used to be light text on a dark window, for decades before the Mac and Windows came along. There were many reasons for it besides avoiding screen burn.

I get headaches and light themes feel like someone is stabbing me in the eyes. Dimming, dark themes etc are sometimes still too bright. Even when I don’t have a headache I still prefer a dark or gray mode.

Because people have gotten used to using their devices at night and in badly lit rooms. I think it's one of the worst design trends in recent times with negative effects:

"[...]To summarize, a dark-on-light (positive polarity) display like a Mac in Light Mode provides better performance in focusing of the eye, identifying letters, transcribing letters, text comprehension, reading speed, and proofreading performance, and at least some older studies suggest that using a positive polarity display results in less visual fatigue and increased visual comfort. The benefits apply to both the young and the old"

https://tidbits.com/2019/05/31/the-dark-side-of-dark-mode/

Because dark mode is superior.

It can be used during day time and it doesn't give you headache at night time.

One problem is once every other app is supporting it, it's hard not too, especially on mobile. I'm working on an iOS app at the moment in which it was decided to defer doing dark mode - every time I switch into it on my phone in dark mode it feels really out of place and noticeable.

it’s especially fascinating since it was conventional wisdom amongst HN and every designer that i ran into that somehow white backgrounds were easiest and also you should use grey text to reduce contrast.

(added: we’ve got some of those folks popping up in this thread now.)

and then bam one day we’ve got dark backgrounds everywhere.

I always liked darker things, even outside computers. Whenever I can make something darker, I do it. Feels much comfortable to the eyes. Bit I'm pretty sure light UIs are still the most popular. Maybe not in certain crowds, but for the general public, I think light UI is king.

When the screens were tiny by today's standards (like the screen in the original Macintosh), black-on-white kind of made sense. But with the large screens too much white hurts the eyes.

Dark mode started to become popular after phones started to use OLED screens.

To save battery and burning issues.

Dark mode won because nowadays it´s associated with "new".

When I started coding in the 90s dark mode was associated with old. "Cobol dinos" used dark modes, we "cool kids" used light modes. Nowadays if you ask most young programmers they will say that light mode is old. They use dark mode.

And I guess this idea of hip, has turned mainstream lately. The latest uses "dark"

it didn't. it's just a fad amongst young programmers that will slowly dissipate

developers develop apps and like dark mode. light mode hurts my eyes

I think a lot of it was just young, trendy counterculture that followed the shift in tech demographics in the last few decades. Sublime Text was hot and it was dark. Another thing that helped it along was the fact that when your eyes adjust to a dark mode app, context switching to a "light mode" app is painful on the eyes. So people reinforced the idea that "light mode" hurts, rather than that switching hurts.

Often have severe migraines. When it’s coming on Dark mode is sometimes the difference between major or mild. Night shift helps some.s

Fl-41 glasses work much better, but I often don’t have them handy.

It's become easier to implement them.

Now that many people moved their CSS into JS and that components are more standalone, you can simply flip a flag and use another color palette.

Take this React pseudocode as an example.

Before, you would have to handle it manually. "html.dark-theme .menu .menu-item .menu-link {color: white; background: black;}" ... for every single style declaration.

Sure, preprocessors made them easier in the way that you could simply do ".dark-theme & {}" which would generate the style declarations for you. But it was still a bit of a pain and required using things like mixins that add an extra layer of complexity and support.

Now, your React component can simply be myAwesomeComponent: { titleColor: theme.text, cardBackground: theme.highlight, cssOverrides: css`border:1px solid ${theme.borderColor};` }

Then you have something somewhere that just flip the theme.

const darkTheme = {text:"#fff", highlight:"#000", borderColor: "#ccc"};

mySuperCoolApp.setCurrentTheme(darkTheme);

This makes adding a bunch of themes an afterthought. On an internal app that I worked on, I made a bunch of themes as easter eggs. All that was needed was to duplicate the theme declarations and change the colors. So some users could decide to use different colors.

Another point is that accessibility is becoming more mandatory than before. If you are required by law to support multiple font-sizes, you might as well make it so that you can support multiple colors. It allows things like high-contrast accessibility themes and you can throw in a few extra fun ones just to make your app stand out.

It doesn’t really feel like it has “won”. Lighter themes are still overwhelmingly the default option (and sometimes the only option).

I can’t think of any app or website where dark mode has been added as a “forced” choice. The addition of a dark mode is almost always implemented as an optional feature and you can generally choose your preference.

So from a user’s point of view, I can only see this as a positive addition. For those of us who prefer dark mode, for a variety of reasons, we enjoy having the choice. For those who prefer lighter themes, nothing really is being taken away.

The more interesting question to me is why this topic evokes such strong emotions with one side stating often in very strong terms how “wrong” the other side is!

The big companies were going to be launching redesigns anyway - as institutions, they're not equipped to "don't fix what isn't broken."

I'll suggest two things: the idea, however misguided, of saving battery power on cellphones, and Quake II. Before dark mode became Dark Mode, gray type on black was a popular enough design aesthetic to inform the more functional implementations later on. Batteries have been insufficient for the entire smart phone era.

I think you're underestimating just how much some people like dark mode; people have been clamoring for it for a long time. Be it for aesthetics, for power saving on OLED screens (a big factor that drove early per-app toggles on Android), and for comfort if light UIs are painful. Once it became a common system-wide option and developers didn't have to create inconsistent per-application toggles, it was a feature that users expected everywhere.

2016-08-08: Windows 10 Anniversary update includes system-wide dark mode option.

2018-06-04: W3C issue created for light/dark mode via CSS: https://github.com/w3c/csswg-drafts/issues/2735

2018-09-24: MacOS 10.14 (Mojave) includes system-wide dark mode option. Safari tech preview adds the CSS media query `prefers-color-scheme`.

2019: All major browsers implement `prefers-color-scheme`.

Et voilà, dark mode everywhere.

Personally, I'm more interested in high-contrast modes. (Available in CSS via the experimental but widely implemented `prefers-contrast` media query. Web devs, support it today! Make life easier for those of us who struggle when forced to stray from good ol' #FFFFFF and #000000.)

Dark mode has a strong preference among some computer users because it works better in dark "computing caves" with low ambient light; when you consider that older screens were relatively dimmer and had severe glare issues, the computer cave was itself a sensible way to do computing. I know I was all about dark mode 15 years ago or so with my first LCD monitor.

But it's also primarily a young person's thing to be able to stay in the cave. Older people are more often put in a position where strong ambient light is assumed, either because of job/household environment or because their eyesight starts to prefer it.

What I want to know is why I'm not reading this in dark mode.