Uploaded October 2019 | Updated September 2026, 2 weeks ago

---

Dark mode is all the rage, with iOS, macOS, Android and others all shipping a system-wide dark mode for people's devices. By default, your website will not switch with the OS. If you want a site you've built to switch, how do you do that? Deja Hodge will show you the CSS you need to know to implement a dark or light mode in your sites with the `prefers-color-scheme` media query.

MDN: developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme
The CSS specification where this is defined: drafts.csswg.org/mediaqueries-5/#prefers-color-scheme