Live data from Hacker News

Using Dark Mode in CSS with MacOS Mojave

paulmillr.com

61–70 of 128 posts

Re: Using Dark Mode in CSS with MacOS Mojave

#61
I, for one, am tired of web pages being able to know things about the environment in which I view them outside of their sandbox. Orientation, battery, point:pixel ratio, user-agent, referer- now UI display preferences.

I should be able to turn all of these off and make my browser indistinguishable from any other save for IP address if I so choose. This stuff just keeps rolling down the fingerprinting hill. Pretty soon they won’t need cookies at all.

Re: Using Dark Mode in CSS with MacOS Mojave

#62
post #29

This is a great blog post to build awareness of the prefers-color-scheme feature. But I don't think it's safe to assume that someone who sets a dark UI also wants web pages displayed like that. I set dark mode in macOS to have the UI fade into the background and reveal the content; I don't want or expect that websites will present white text on a dark background too. That's fine for coding but can be less readable fo…

As a counterpoint, I find a white app or webpage jarring in dark mode and much prefer light/white text on dark background. I’m happy that the rest of the os is catching up with how I’ve run my IDE for years.

Well in this camp. I know there's evidence to suggest that black on white is better for reading comprehension, but I honestly find it straining.

To me black on white is just a hangover from old skeuomorphic design principles.

Re: Using Dark Mode in CSS with MacOS Mojave

#63
post #38

This is a great blog post to build awareness of the prefers-color-scheme feature. But I don't think it's safe to assume that someone who sets a dark UI also wants web pages displayed like that. I set dark mode in macOS to have the UI fade into the background and reveal the content; I don't want or expect that websites will present white text on a dark background too. That's fine for coding but can be less readable fo…

This is why I think they should focus on exposing the dark mode setting in Javascript instead of CSS. Sites that support dark mode should (and will almost always) have a toggle for it. It'd be better if this setting helped _inform_ the default initial state rather than _forcing_ a choice on you. To me, that's a lot easier done with a Javascript API than CSS.

More javascript is almost never the best solution to any problem, particular when it’s shown that css can achieve the same result.

Re: Using Dark Mode in CSS with MacOS Mojave

#65
post #29

This is a great blog post to build awareness of the prefers-color-scheme feature. But I don't think it's safe to assume that someone who sets a dark UI also wants web pages displayed like that. I set dark mode in macOS to have the UI fade into the background and reveal the content; I don't want or expect that websites will present white text on a dark background too. That's fine for coding but can be less readable fo…

As a counterpoint, I find a white app or webpage jarring in dark mode and much prefer light/white text on dark background. I’m happy that the rest of the os is catching up with how I’ve run my IDE for years.

it is but it's not feasible for the system theme to change the styles of websites.

Just ask any Linux user that uses dark themes and you will find out what happens when the system theme messes with the site theme.

I myself always set a light theme in my Firefox config so I don't get a black on black text/background issue.

With how customized the styling on sites is every site needs to implement their own dark version otherwise you will run into situations where the styling is broken.

Re: Using Dark Mode in CSS with MacOS Mojave

#66

Earlier quoted context omitted.

However, Mail does have a dark stylesheet for the viewer when Dark Mode is enabled. I guess this can be done when there's a concept of a base stylesheet which people can the overwrite if needed. Word processors don't have this concept, and what you see is (supposed to be) always exactly what you get. So Pages doesn't display dark documents because the output then should be a dark document.

Apple is proposing a new CSS color-filter property [1], which would do the same thing as Mail does for its content. Actually, Apple is already using color-filter internally in the Mail app. Safari allows setting user style sheets in its Preferences: Advanced > Style sheet, so one could perhaps add a user style sheet with color-filter. [1] https://github.com/w3c/csswg-drafts/issues/2875

There are several safari extensions available already which bring dark-mode to websites. Based on the results I beleive at least some of the one I’m using must be using a filter (rather than using say manually mapped colours in a hash).

Re: Using Dark Mode in CSS with MacOS Mojave

#67

This is a great blog post to build awareness of the prefers-color-scheme feature. But I don't think it's safe to assume that someone who sets a dark UI also wants web pages displayed like that. I set dark mode in macOS to have the UI fade into the background and reveal the content; I don't want or expect that websites will present white text on a dark background too. That's fine for coding but can be less readable fo…

Exactly! That's my take on this too. Dark Mode should only be for UI elements not for actual content. They would never do that with a PDF either.

Curious, I ended up turning off dark mode because I found web pages were jarringly bright compared to everything else on the screen.

Re: Using Dark Mode in CSS with MacOS Mojave

#68
post #39
post #38

Earlier quoted context omitted.

This is why I think they should focus on exposing the dark mode setting in Javascript instead of CSS. Sites that support dark mode should (and will almost always) have a toggle for it. It'd be better if this setting helped _inform_ the default initial state rather than _forcing_ a choice on you. To me, that's a lot easier done with a Javascript API than CSS.

You'd be able to do this with the matchMedia API: https://developer.mozilla.org/en-US/docs/Web/API/Window/matc...

I didn't know about that, thanks for that!

Re: Using Dark Mode in CSS with MacOS Mojave

#69
post #38

Earlier quoted context omitted.

This is why I think they should focus on exposing the dark mode setting in Javascript instead of CSS. Sites that support dark mode should (and will almost always) have a toggle for it. It'd be better if this setting helped _inform_ the default initial state rather than _forcing_ a choice on you. To me, that's a lot easier done with a Javascript API than CSS.

More javascript is almost never the best solution to any problem, particular when it’s shown that css can achieve the same result.

My argument is that CSS doesn't achieve the same result; it forces one particular mode on you instead of allowing a choice.

Re: Using Dark Mode in CSS with MacOS Mojave

#70
post #29

Earlier quoted context omitted.

As a counterpoint, I find a white app or webpage jarring in dark mode and much prefer light/white text on dark background. I’m happy that the rest of the os is catching up with how I’ve run my IDE for years.

Well in this camp. I know there's evidence to suggest that black on white is better for reading comprehension, but I honestly find it straining. To me black on white is just a hangover from old skeuomorphic design principles.

I found that black background with white text is great when you have perfect eyesight but once your eyesight starts to go and you start needing glasses white background with black text is easier to read.

it's quite odd. It could be just a personal thing though.

Post reply on HN