This site now supports dark mode

I prefer to use light interfaces, so I rarely use dark mode in macOS or iOS. I often see people add dark mode to their sites, but never really knew whether visitors actually care. I started a Twitter poll:

Do you consider dark mode on websites / blogs (not apps) useful?

The poll is still open. At the time of writing, 225 people responded, and 47% answered "Yes". Enough to convince me to add a dark mode to my blog.

This site is built with Tailwind, and I wanted to be able to write classes like bg-white dark:bg-black based on the prefers-color-scheme media query. I came a across a post by Stefan Zweifel with an elegant solution to register it as a "screen" in Tailwind.

// tailwind.config.js
module.exports = {
  theme: {
    extend: {
      screens: {
        dark: { raw: '(prefers-color-scheme: dark)' }
      }
    }
  }
};

Here's the commit that added dark mode support to this website. Since my design is quite minimalistic, it didn't require too many changes.

Check out Stefan's post for an in-depth explanation on the Tailwind configuration, and enjoy reading this website in the dark from here on!