Website dark theme for macOS Dark Mode

macOS Mojave is using a well integrated and quite used Dark Mode interface. Of course, a Light Mode interface is also available, but here we will talk about the Dark one :)
A lot of macOS users prefer the Dark Mode and major software developers will add, or already have, dark mode support for their software. Your website ... guess what, is just another piece of software that macOS users are using it.

So why not enable a dark mode theme, automatic enabled, for your website? It's quite easy in fact.
In order to add and enable an automatic dark theme for macOS Mojave visitors, all we need are just few lines of css code.
As an example, below is the css code that sets and enable dark mode for this blog.

@media (prefers-color-scheme: dark) {
 html, body, #footer, .post, button {background-color: #261f1cc9;}
 .summary, .post h1 a, .post h1 a:visited, .post h1 strong, .post h2 a,
 .post h2 a:visited, .post h2 strong, #menu li a, .content-wrapper,
 a.site_name, button, .post-body {color: #ececec;}
 #menu, #credit, #footer, .info {background-color: #333;}
}

For now, this css media query @media (prefers-color-scheme: dark) is recognized and used by Safari and Firefox, no Chrome support for the moment (at the article date). Other OSs are also providing dark mode interfaces (Windows 10 and Pop!_OS have a Dark Mode) but for now, the browsers used in this OSs does not respond to the website automatic dark theme, but if this will be enabled in the future, the automatic dark theme of this blog will hit :)