Automatically select light/dark mode based off user preference
See original GitHub issueHey,
Since this theme appears to come out-of-the-box with both a light and dark mode, what about adding some sort of automatic theme selector based on prefers-color-scheme? From my experience, all you need is @media (prefers-color-scheme: dark) { ... } to automatically select this. I don’t know how that’ll interact with the theme toggler though.
Issue Analytics
- State:
- Created 3 years ago
- Comments:8 (5 by maintainers)
Top Results From Across the Web
Set your Web App to Dark/Light Mode based on User System ...
Detecting System theme using matchMedia() It detects if the system is in a dark theme or light theme. The matches property of the...
Read more >How to switch between Windows 10 light and dark modes on ...
To switch from the dark to light system mode automatically on Windows 10, ... select the option Run whether user is logged on...
Read more >Use a light or dark appearance on your Mac - Apple Support
Select Light, Dark, or Auto on the right. Light is a light appearance that doesn't change. Dark is a dark appearance that doesn't...
Read more >prefers-color-scheme - CSS: Cascading Style Sheets | MDN
A user indicates their preference through an operating system setting (e.g. light or dark mode) or a user agent setting.
Read more >javascript - Dark mode - how to handle the auto preference
1 Answer 1 · light for light scheme that will override system/browser setting · dark for dark scheme that will override system/browser setting ......
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found

@timrossback I have done this now and it will ready in the next release.
Hey @timrossback, that is exactly how I’d do it as well. No worries, I’ll see if I can make this change over the next few days.