The Future of CSS: Easy Light-Dark Mode Color Switching with Light-Dark() • Hacker News Board

Re: The Future of CSS: Easy Light-Dark Mode Color Switching with Light-Dark()

#71

Post by bramus » Wed, Oct 11, 2023, 8:21 AM UTC

LeonB wrote: post #30

If I look at the times I’ve implemented dark mode — I see that the effect will be: 1. Less lines of code (seems like a good thing) 2. I will still need to use prefers-dark-mode for some of my changes. Thus — the concept count is ratcheted up by 1 more thing, and no concept is taken away. The “concept count” is ridiculously high already. They’re spending money from an overdrawn account. If you want to permanently incr…

> I will still need to use prefers-dark-mode for some of my changes

Can you detail what those would be? I’m curious to know :)

Re: The Future of CSS: Easy Light-Dark Mode Color Switching with Light-Dark()

#72

Post by bramus » Wed, Oct 11, 2023, 8:29 AM UTC

politelemon wrote: post #62

Would this make toggling between schemes easier? Suppose there is a button on the page that lets user pick light or dark. What would the js look like?

Toggling between schemes is not part of this feature.

Easily toggling light/dark is part of the Web Preferences API feature, which is being prototyped in Chrome: https://chromestatus.com/feature/4631882616012800

Re: The Future of CSS: Easy Light-Dark Mode Color Switching with Light-Dark()

#73

Post by Rapzid » Wed, Oct 11, 2023, 11:26 AM UTC

habosa wrote: post #28

I’m consistently amazed at how much energy has been put into the light/dark UI pattern for web and mobile apps. Way way more than was ever put into dealing with colorblindness or any other form of color adjustment imo. It’s nice to have the choice but I also wonder what else might have been done with all that UX/UI design and SWE time.

It's because devices have been pushing these system preferences.

At one point I believe MacBook Pros were coming with default dark mode(or at least asking you which you prefer during startup).

My phone auto switches to dark preference based on time/environment.

Now, you don't want to be the ONLY product your user uses that blasts their eyeballs out because it doesn't respect system preferences.. Do you?

Re: The Future of CSS: Easy Light-Dark Mode Color Switching with Light-Dark()

#74

Post by LeonB » Thu, Oct 19, 2023, 1:03 PM UTC

bramus wrote: post #71

LeonB wrote: post #30

If I look at the times I’ve implemented dark mode — I see that the effect will be: 1. Less lines of code (seems like a good thing) 2. I will still need to use prefers-dark-mode for some of my changes. Thus — the concept count is ratcheted up by 1 more thing, and no concept is taken away. The “concept count” is ridiculously high already. They’re spending money from an overdrawn account. If you want to permanently incr…

> I will still need to use prefers-dark-mode for some of my changes Can you detail what those would be? I’m curious to know :)

Sorry I missed this question earlier.

I may turn down the brightness on images, generally, in dark mode. (Using a filter).

And have some classes that mean “don’t alter the brightness of this image, in dark mode”

And there may be other images which I will invert the color of. For example any image that is basically black text on a white background — it’s better to invert it completely rather than just lower the brightness.