Prefers Color Scheme Media Query
Posted:
November 19, 2018
Safari’s latest Technology Preview release brings with it support for the prefers-color-scheme
media query, which many think of as ‘enabling dark mode’, but it can also work if the user prefers a light color scheme.
The theme for this blog is dark by default, but I’ve now added a light color scheme.
@media (prefers-color-scheme: light) {
body {
background-color: #eee;
color: #666;
}
}
For more info check the official spec.
Track implementation progress with other browsers here:
Comments
James Clarkson
Thanks for this post. I think it’s worth noting that this requires macOS Mojave (10.14), High Sierra (10.13) doesn’t support dark mode so this media query doesn’t work either.
Leave a Comment
Your email address will not be published. Required fields are marked *