29 lines
1.1 KiB
Markdown
29 lines
1.1 KiB
Markdown
template: post
|
||
title: Respect my damn color scheme preference
|
||
author: flewkey
|
||
timestamp: 1636400000
|
||
license: CC-BY
|
||
|
||
I recently switched from light themes to dark themes. Dark themes seem to be
|
||
supported enough that most applications seem to work with them. Many
|
||
websites don’t, but it’s not the end of the world. Theming is hard and I do not
|
||
expect developers to support it.
|
||
|
||
However, I find it inexcusable and frustrating when a website already has a dark
|
||
theme, but ignores the user’s preferences. Especially if they have a stupid
|
||
little theme selector that writes to a value in localStorage or something.
|
||
|
||
![That’s _not_ how you do that!]({root}images/theme-selector.png)
|
||
|
||
If you must use JavaScript to set your themes, consider taking your user’s color
|
||
scheme preference into consideration when choosing which theme to default to. We
|
||
will be grateful.
|
||
|
||
```
|
||
if (window.matchMedia("(prefers-color-scheme: dark)").matches)
|
||
/* Set theme */
|
||
```
|
||
|
||
Even better, you can just use a media query like a normal person. If you need
|
||
to override it with JavaScript later, you can do that.
|