Dark Theme for the Blog

Just finalized the dark theme for the blog. The idea is simple, use prefers-color-scheme media query and wrap dark style elements with it:

@media (prefers-color-scheme: dark) {
    a {
        color: #4be
    }
}

The browser then will respect the OS dark mode or have its own night mode and show your website in dark:

That's simple and cool!

One of the problems currently is testing. It is possible but rarely comfortable. None of the browsers has mode setting in their dev tools.

• Firefox only reads theme status from the operating system. There are some switcher extensions but they don't work properly.

• Chrome can be run with --force-dark-mode CLI param.

• Opera here is the best. Choosing light/dark themes in browser will also change the prefers-color-scheme rendering in the fly.