141–150 of 191 posts
> Photographs also looked harsh. It turns out that many people prefer images, too, to be desaturated in dark mode This is an interesting choice. While it might be easier on the eyes, personally it feels kind of icky to change colors on images…
Try accomdating for Dark Mode as an email developer...
Where did this dark mode craze come from? Don't get me wrong - I quite enjoy dark mode most of the time, but why now and not earlier?
https://android-developers.googleblog.com/2012/01/holo-every...
I recently added dark-mode support to a few sites. It took way more time then I thought it would. At first I thought "oh just add a few lines off CSS" but then ... * Some diagrams had white backgrounds Solution: remove the backgrounds so they are transparent * Most diagrams had black lines/arrows which didn't look good on dark gray backgrounds Solution: use CSS filter:invert for images * Some images are photos not di…
Every time I think "oh just add a few lines off CSS" => 90% chance it'll take all day.
Earlier quoted context omitted.
I'm aware of that, but images on a website being desaturated or having a dark background doesn't seem like it would help. (I do agree with your appeal to those who are sensitive to bright lights, FWIW. It's just that this one sounds like a bit of a reach.)
If you are illegally camped in a dark field and your phone, tablet or laptop is the only source of light, bright white images emit much more light that can give away your position than dark ones. IIRC, the two primary things we did to conserve battery power were 1. Avoid certain games and 2. Turn down screen brightness. In ordinary usage, the screen on our tablets was typically the biggest drain on the battery. This…
Now if only Hacker News would implement it!
document.body.style.filter = "invert(1)";
document.body.style.backgroundColor = "#141414";
Earlier quoted context omitted.
Every time I think "oh just add a few lines off CSS" => 90% chance it'll take all day.
CSS needs an equivalent to an SQL query planner, so that mere humans can understand how it works.
The problem is that this doesn't let the user toggle dark mode on/off. If you want the user to be able to toggle dark mode on your site without changing their Operating System preferences, then you'll need to implement your dark theme as a class (eg. body.theme-dark) since there's no way to dynamically set the media query. const darkMode = window.matchMedia('(prefers-color-scheme: dark)') if (darkMode) { document.bod…
Sorry, I missed the "without changing their Operating System preferences". I agree with another sibling comment here: that seems like bad practice.
Earlier quoted context omitted.
If you are illegally camped in a dark field and your phone, tablet or laptop is the only source of light, bright white images emit much more light that can give away your position than dark ones. IIRC, the two primary things we did to conserve battery power were 1. Avoid certain games and 2. Turn down screen brightness. In ordinary usage, the screen on our tablets was typically the biggest drain on the battery. This…
"As an example, one commercial QVGA OLED display consumes 0.3 watts while showing white text on a black background, but more than 0.7 watts showing black text on a white background, while an LCD may consume only a constant 0.35 watts regardless of what is being shown on screen." https://en.m.wikipedia.org/wiki/AMOLED
That's really good info.
The problem is that this doesn't let the user toggle dark mode on/off. If you want the user to be able to toggle dark mode on your site without changing their Operating System preferences, then you'll need to implement your dark theme as a class (eg. body.theme-dark) since there's no way to dynamically set the media query. const darkMode = window.matchMedia('(prefers-color-scheme: dark)') if (darkMode) { document.bod…
To me it seems like now that all browsers support the prefers-color-scheme media query, it’s no longer a best practice to allow/force users to toggle between light and dark theme separately from the OS. Centralization of config is a good thing, freeing people from rote work.
My suggestion of still using classes doesn't eliminate centralization of config, it just means moving the dark mode CSS outside of the media query and into a class, and adding a couple lines of Javascript.