Light/Dark/System Theme Setting Design
7 points by artemisSystem
7 points by artemisSystem
I kinda dislike these in general... I don't like the inelegance of having an otherwise completely static document, with precisely one interactive element that switches the theme. Something just irks me about that.
Like, the system setting's there. The people who want dark mode should have set it to dark mode already.
I am even more radical than Lea Verou, my light/dark theme switcher has only one state: "Invert colours". If the browser default is to prefer light colour scheme it'll turn it dark, and vice-versa. Simples.
It's probably very confusing for some people, but the implementation is just one clickable link.
Or you can go in a radically different direction and make darkness a range: https://chrismorgan.info/prefs#theme (see the prefs button in the footer).
So I have 101 states! (Limited to six without JavaScript; and if you really want you can set a value to more than 0.01 precision directly, so you can have a lot more states if you really want.)