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.jsmodule.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!