DEV Community

Nathaniel
Nathaniel

Posted on

Should websites have a dark-mode toggle button?

I'm currently working on a mostly text based website. We are supporting dark-mode using css media-queries.

We're currently discussing if we should have a toggle button.

Not all devices support dark-mode, and users don't always want to stick with the choice made by their OS.

On the other hand, this is just extra code that needs to be downloaded by every user β€”Β and it needs to remember their preferences with localStorage, and I like to not create data when I can help it.

What do you think? Is it actually useful to have a dark mode toggle? or should we stick to supporting the choice made by the OS?

Discussion (8)

Collapse
siddharthshyniben profile image
Siddharth

You should add a toggle. As you said not all devices support dark-mode, and users don't always want to stick with the choice made by their OS. And since it's mostly text dark mode would be really helpful.

Collapse
bglamadrid profile image
Benjamin La Madrid

Totally add an option for that, if it's not a big puzzle to solve in your app's code.
I for one, like to use dark mode on some sites, specially text-fosused ones. Yet I use my OS' light theme because it looks better than its dark mode.

Collapse
ananddhruv295 profile image
Dhruv Anand

Not all devices support dark-mode, and users don't always want to stick with the choice made by their OS.

This does not seem to be a strong statement to not add such an essential feature.
Having the ability to control the theme (light/dark) is very essential, and talking about your site being text-based, toggle seems very important as that helps the user be comfortable.

Collapse
zenorocha profile image
Zeno Rocha • Edited

One misconception developers have with light/dark mode is automatically applying a theme based on the system user preferences.

Although it's safe to assume that users might want their apps to follow that preference, it would be best if they had the option to switch to a different theme manually.

There are all sorts of reasons a user might want to switch. Maybe they want to take a screenshot in light mode, record a screen share in dark mode, or simply prefer to use your app with one theme or another.

Regardless of the use case, you should give them the control to change.

Source: 5 Lessons We Learned Adding Dark Mode to WorkOS

Collapse
terabytetiger profile image
Tyler V. (he/him)

this is just extra code that needs to be downloaded by every user

If this is a concern, wouldn't you want to not ship dark mode at all then? All the media queries will still load for every user as far as I'm aware, even if it's for the theme they don't have set.

Collapse
nombrekeff profile image
Keff

Yeah I thinks it's usually a good idea to let the user change it. And it's not that much code really, so no issues there. If adding the toggle adds some much code that is noticeable, then you might need to rethink how you are approaching that.

Otherwise I don't see any problem for adding a toggle.

There are some people that might have the OS in light mode, but want only your site in dark mode, or vice versa. So it's always nice to give the user the option

Collapse
meatboy profile image
Meat Boy • Edited

IMO, yes. As long as the theme preference in localStorage is null you can stick to the dark/light mode from OS. Otherwise, if theme preference is set in localStorage you should use it.

Collapse
eboye profile image
eboye

I always vote for an option. I like to have control over everything in any app I use, be it web or native.