Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Six Levels of Dark Mode (2024)

cssence.com

Post reply on HN
Print view View original

51–56 of 56 posts

Re: Six Levels of Dark Mode (2024)

#51

Post by Izkata »

ethan_smith wrote: post #38
zamalek wrote: post #8

Is there still no way to prevent the flash bang while waiting for initial content from the server?

A small blocking ` ` in the ` ` that reads the saved preference from localStorage and sets a class on ` ` before any rendering happens is the standard approach. You can also set ` ` which tells the browser to use the OS preference for the initial paint, covering the default case without any JS at all.

That's still after the server's response arrives, they're talking about the blank browser page before anything comes back in the response.

Re: Six Levels of Dark Mode (2024)

#52

Post by Tallain »

bryanhogan wrote: post #39
Tallain wrote: post #34

Earlier quoted context omitted.

I do wish there was more conversation around the levels of blackness for dark modes. Black screen and white text is physically painful for me. I usually have to resort to reader mode, or open up dev tools and change colors myself, to make a page like this readable for me. I appreciate how hard it can be to make a good dark mode; I've spent months building a custom dark theme I term "mid-contrast". It's still WCAG com…

Pure black background with pure white elements is a common accessibility issue. And just curious, why would using "only" 16 colors be silly?

Maybe silly is the wrong word. But sometimes I think I would make things easier on myself if I allowed some shade variants. It's good for me to keep the constraint though.

I've been spending some time creating a Visual Studio theme using this palette and the way that IDE uses colors is... less than great. Trying to find the right token to change is an exercise in madness, and many things that are visually the same in importance/hierarchy use very slightly different shades for some unknown reason.

Re: Six Levels of Dark Mode (2024)

#53

Post by gruez »

K3UL wrote: post #30
gruez wrote: post #21

Earlier quoted context omitted.

>I've heard people say that pure black is more battery efficient for OLED displays (but don't know if this is true) No. https://www.xda-developers.com/amoled-black-vs-gray-dark-mod...

Did you even read before pasting? Yes technically it is, which would indeed be in line with "levels of dark mode".

Did you? If you read the article you'll find that there's a specific (and quite popular) claim going around that 0% brightness is much more efficient than 1% brightness because pixels can be "fully off". Yes, it's theoretically more efficient, but as per the article it's within the margin of error. For all practical purposes, it's not more efficient.

Re: Six Levels of Dark Mode (2024)

#54

Post by WorldMaker »

akersten wrote: post #33

kind of sad that the CSS specification wound up with this clunky `light-dark(white,black)` thing instead of literally anything more extensible like, `themed(dark(black), light(white), retro(purple))`. Then you'd be able to have a cool theme dropdown like sites used to have, fully CSS-driven with essentially no JS required, in a compatible and modern way.

The proposers of `light-dark()` themselves recognized that `light-dark()` was presumably a "stepping stone" towards (and then eventually just a shorthand for) a deeper `schemed-value()` function similar to what you are asking for, once CSS also picked up a way to define custom color schemes. (Often proposed as an `@color-scheme` rule or block.)

It can be an interesting discussion to follow: https://github.com/w3c/csswg-drafts/issues/9660

Re: Six Levels of Dark Mode (2024)

#55

Post by Zak »

akersten wrote: post #33

kind of sad that the CSS specification wound up with this clunky `light-dark(white,black)` thing instead of literally anything more extensible like, `themed(dark(black), light(white), retro(purple))`. Then you'd be able to have a cool theme dropdown like sites used to have, fully CSS-driven with essentially no JS required, in a compatible and modern way.

It breaks the zero one infinity rule by supporting an arbitrarily limited number of themes: exactly two.

https://en.wikipedia.org/wiki/Zero_one_infinity_rule

Re: Six Levels of Dark Mode (2024)

#56

Post by skoskie »

zamalek wrote: post #8

Is there still no way to prevent the flash bang while waiting for initial content from the server?

Came here for this. I hate it too. When I make a site with dark mode, I make sure the dark color loads by default and then changes to light if needed to address this specific issue.
Post reply on HN