The theme toggle, an empty vanity

TLDR: This site has a darklight theme, but it doesn't have a dark/light mode toggle or a theme selector because your browser/device already has one.

The primary goal for this site was to force myself to write more. I always enjoy having written, but I rarely enjoy the act of writing itself.

One of the more enjoyable aspects of having this site is having a place to tinker with things and explore ideas. Sometimes that enjoyment becomes a "productive" distraction from that primary goal.

A darklight theme one of the first things I implemented for this site.

But before adding a feature for a features sake I asked myself the following two questions:

Should you provide a darklight mode?
Should I add a theme toggle control?

This very site, brooding in dark modebeaming away in light mode.

Question 1: Should you provide a darklight mode? #

A dark color scheme can reduce eye strain, especially in low-light environments, can extend battery life (for certain OLED display types), and some users find dark mode visually appealing and modern.

Light mode has been the standard for a long time, and many users are accustomed to it, so it has become an expected feature.

Light mode is generally more readable in well-lit environments. A Human Factors study suggests light mode enhances the legibility of text, and as a result, the reading comprehension and proofreading performance of the reader. Light backgrounds can also be more conducive to displaying accurate colors in some scenarios.

Neither dark or light mode is objectively superior; each has its merits and pitfalls that depend on individual preferences and other factors out of your control. The most responsible course of action is obviously to offer both a light and dark mode and let the user decide.

Once it was finished implementing the darklight mode, I was slightly embarrassed to say that I was excited to work on a cool toggle switch.

Question 2: Should I add a theme toggle control? #

My initial intuition was that this would be an easy yes. these were honestly the best reasons I could devise:

Appeal of Novelty: Because it will be fun (think of all the time we can spend tweaking the easing curve on an elaborate sun into moon animation) 🤓
Optimism bias: Because it's easy. Once you have the theme designed and implemented in CSS Custom properties, the code to implement switching between modes using a toggle is trivial
Bandwagon effect: Because everyone has one (someone even built a beautiful site dedicated to cataloging common theme toggle types)
Vanity: Because I put all this effort into supporting a darklight mode, not every site has one, so why not make it discoverable and easily accessible?

Less than convincing. Perhaps I should have asked a more open question. A question like "How should the user select a theme?".

This is a better question to ask as it opens up the possibilities to a reality that was quick to come to mind.

Users already have a global and robust way to define their preferred theme and browsers do a good job of honoring the application of these preferences.

The Android theme controls also allow for scheduling for when a particular theme should be applied — The Firefox mode selector allows you to explicitly set your preference for the browser or to defer to a preference you've set more broadly at the Operating System level

However it's important that the default value should be set to use the system preference and that the users shouldn't see a Flash of inAccurate coloR Theme which is very likely as the code to store and and respond to previous preference is going to be running after a page’s first render.

These controls work system-wide/device-wide, often at the Operating System level (where the user can set it once) and at a per-application level where users can automatically adjust their preferred theme based on conditions like the time of day or ambient light conditions.

From a theming perspective, there is nothing unique enough about this site that I should have any reason to think it would be an exception to how a visitor would normally prefer to consume their content.

Adding a theme toggle to the page adds design redundancy at the cost of complicating a simple feature. It's also an extra tab stop for keyboard/screen reader users and an additional eye fixation. It's also extra code to maintain.

…[Perfection is achieved] not when there is nothing left to add, but when there is nothing left to take away.

— Antoine de Saint-Exupery. (2022). Wit & Wisdom. The Week, (1413), 21.

Maybe, the user will never discover and beam in wonder at the exceptional darklight theme I toiled away on (a noble sacrifice on my part).

But maybe, the best theme toggle is the one the user already has.