# Support \`prefers-color-scheme\` CSS media query

**URL:** https://meta.discourse.org/t/support-prefers-color-scheme-css-media-query/115445
**Category:** Feature
**Created:** [April 19, 2019, 1:35am UTC](https://meta.discourse.org/t/support-prefers-color-scheme-css-media-query/115445 "2019-04-19T01:35:36Z")
**Posts on this page:** 1
**Showing post:** 7

<div class="post-metadata">

### Author: ![pmusaraj](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/pmusaraj/32/119489_2.png) [@pmusaraj](https://meta.discourse.org/u/pmusaraj)
#### Post date: [April 19, 2019, 11:04am UTC](https://meta.discourse.org/t/support-prefers-color-scheme-css-media-query/115445/7 "2019-04-19T11:04:57Z")

</div>

There is an experimental theme component that does the automatic switch based on media queries:

> [@Dark Mode Automatic Theme Switcher](https://meta.discourse.org/t/dark-mode-theme-switch-for-safari-on-macos/112071):
>
> warning Discourse now supports [Automatic Dark Mode color scheme switching](https://meta.discourse.org/t/automatic-dark-mode-color-scheme-switching/161593) in core, this component is now deprecated and should no longer be used. [Repository](https://github.com/pmusaraj/discourse-dark-mode): https://github.com/pmusaraj/discourse-dark-mode Installation instructions: [Installing a theme or theme component](https://meta.discourse.org/t/how-do-i-install-a-theme-or-theme-component/63682)What this does? This component allows automatic switching to a dark theme when the browser is set to dark mode. This works for logged-in users only on all browsers that support the [prefers-color-scheme](https://caniuse.com/#feat=prefers-color-scheme) media query. By de…

Because `window.matchMedia` is not available server-side, as you note, the component evaluates in JS whether `prefers-color-scheme` matches the current theme, and if not, sets the correct theme and reloads the site with the updated theme.

---

_[View the full topic](https://meta.discourse.org/t/support-prefers-color-scheme-css-media-query/115445)._
