Phillip Mooney has written a dark theme for the Marxists Internet Archive, through the prefers-color-theme media query. The browser (or in most cases, the desktop environment) indicates whether it’s using a dark or light theme, and you can style your site accordingly.

At the moment it’s disabled on the MIA because it conflicts with styling in local archives which rely on including the base CSS. The only proper way to solve this is to systematically test how a dark theme looks in all the files which include the base style.

Accessibility

Some people appreciate a dark theme because it can reduce eye strain caused by staring at harsh white screens all day. There are dissenting perspectives who suggest that dark mode doesn’t have as much an effect on eye strain as blue light. You might feel like dark mode makes a difference, but what if your feelings are just subjective and wrong?

You can get a similar kind of effect by adjusting the colour temperature of your display. This is the same reason why, at the moment, the background for this site is not pure white and the text is not pure black. The colours are very slightly shifted and the contrast toned down to make it more comfortable to read.

The dark mode on my GNOME desktop is a good example of this.

It’s mostly dark grey, black and white is used sparingly.

Meanwhile there are arguments against the trend for muted low-contrast themes. Light grey text on a white background is considered particularly problematic, despite its obvious popularity in web design.

W3C accessibility guidelines suggest a contrast ratio of at least 4.5:1 for images and text. The general rule seems to be that higher contrast is better for accessibility.

It seems like the user requirements of a dark theme pull in different directions. One group just wants an aesthetically pleasing reading experience, while another group has specific accessibility needs. The former demands subdued greys and milky whites, the latter demands sharp high-contrast scenery.

Panel technology

When I was trying out colour combinations on my laptop, I found it difficult to get a good contrast balance. It’s immediately obvious how washed out ‘medium grey’ looks when going from my cheap laptop screen to my fancy desktop IPS panel. My laptop has a typical contrast ratio of 600:1, while my desktop has a ratio of 1000:1. That makes a noticeable difference.

The latest Samsung phones have OLED displays, which generally have much higher contrast ratios. New monitors and TVs now compete on High Dynamic Range certification. I can only judge what looks good on my monitor, and what appears to me like a rich dark background might look faded to someone else.

Cyberpunk dark mode

Dark themes also go along with an aesthetic preference for cyberpunk user interfaces. For example, when my phone switches to dark mode it doesn’t just go black and white, there’s a pale bluey highlight.

android_dark_mode

Some people set their terminal colours to black and green. It gives a ‘hacker’ look, although it’s hardly practical. I get this effect when squinting at my bedside digital clock early in the morning.

digital_alarm_clock

Green on black is not necessarily easier to read, and if anything it’ll probably give you worse eye strain in the long run.

My initial palette for the MIA’s dark theme was inspired by this style.

old colour palette

You could take it further with more vibrant colours. Make bold use of lime and magenta! In this respect, a dark mode is an opportunity to be a bit more playful with colour, and go all in on a ‘neon retro’ look. The final palette came out a bit more reserved.

new colour palette

Dark mode as a fashionable trend

The dark theme query in CSS is relatively recent, it was only properly introduced last year and it’s already supported by all major browsers. On the desktop environment level, MacOS got a dark mode in winter 2018, and Windows followed in summer 2019. This combination of popularity and rapid adoption means it’s now seen as a standard for modern web design. The base theme for this site started off as a dark theme by default, and I could re-introduce the dark colour scheme, if I had enough time and motivation.

It’s no secret that the Marxists Internet Archive looks old. It looks so antique that when I told a friend about this he showed me memes about the day MIA finally updates its front page.

retro_marx_quote

Despite the jokes, I’ve come to appreciate that the MIA only appears out of date because it’s running on a different time scale to most other websites. At this point the archive has been online for over 24 years, which in the history of the internet makes it practically ancient. It continues to survive for so long partly because it doesn’t embrace every new thing which comes along. It is designed to last. So if it takes a long while to implement a dark theme and get all the CSS in order, that’s okay.