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

Using Dark Mode in CSS with MacOS Mojave

paulmillr.com

Post reply on HN
Print view View original

71–80 of 128 posts

Re: Using Dark Mode in CSS with MacOS Mojave

#71

Post by Fuxy »

josho wrote: post #67
ThomPete wrote: post #57

Earlier quoted context omitted.

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.

Don't you use websites that have a dark theme more instead. I always preferred websites that allowed me to select a dark theme and it seems to be more and more popular to do that.

Hell even you-tube does that now.

Re: Using Dark Mode in CSS with MacOS Mojave

#72

Post by giobox »

codazoda wrote: post #47
morley wrote: 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 could easily apply or remove the css via Javascript to allow enable / disable of the feature.

Exactly. This is going to be the simplest browser extension anyone has ever written, if someone hasn’t done so already.

Re: Using Dark Mode in CSS with MacOS Mojave

#73

Post by Fuxy »

michaelmior wrote: post #59
ThomPete wrote: post #57

Earlier quoted context omitted.

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.

It's really a matter of preference. I personally would be happy if my PDFs would automatically display in "dark mode" (not that I expect that to be implemented). Perhaps browsers just need a setting to toggle this.

Moon reader + on android allows you to invert the colours and that's what I do every time when I read pdf's and the like.

Re: Using Dark Mode in CSS with MacOS Mojave

#74

Post by S_A_P »

Fuxy wrote: post #65
S_A_P wrote: 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.

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…

That I agree with, and this "responsibility" ultimately falls on the webmaster/content provider to allow a dark theme in a method similar to this post...

Re: Using Dark Mode in CSS with MacOS Mojave

#75

Post by stephenr »

morley wrote: post #69
stephenr wrote: post #63

Earlier quoted context omitted.

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.

You have all the choice in the world. Use whatever tech you want (browser js, server side templating, client side xslt, etc) to have an attribute on the body element indicating opt-in status, and use that in your media query to target only the users who want it.

With the css solution it’s doable on a site that has no javascript.

Re: Using Dark Mode in CSS with MacOS Mojave

#76

Post by consto »

ThomPete wrote: post #57
modernerd wrote: post #8

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.

Why not? I have a chrome extension to darken and/or invert webpages and PDFs, and I have SumatraPDF setup white text on black background for editing LaTeX?

Re: Using Dark Mode in CSS with MacOS Mojave

#77

Post by SpacePotatoe »

Fuxy wrote: post #65
S_A_P wrote: 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.

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…

>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.

It is done completely different fashion than it was done on gnu/linux, on linux it was probably done by changing user agent style sheet (changes default bg color on body etc), when here it is done with media query (which webdev must explicit implement on his part so he can make sure that everything works).

Re: Using Dark Mode in CSS with MacOS Mojave

#78

Post by kitsunesoba »

michaelmior wrote: post #60
akuji1993 wrote: post #19

Earlier quoted context omitted.

Hm, okay. Then it might make sense to support this, if your user base heavily relies on MacOS. Thanks for the link.

Windows has also had dark mode for apps for a while, so I wouldn't be surprised if Edge picks this up in the future.

Also on Linux GNOME has had a popular dark mode for its default theme (Adwaita) for ages now, and KDE has a bundled dark theme bundled by default (IIRC, haven’t used KDE in ages).

I think Android has this option too?

Basically, it’s not just a “macOS thing”, lots of systems now have dark modes.

Re: Using Dark Mode in CSS with MacOS Mojave

#79

Post by _emacsomancer_ »

modernerd wrote: post #8

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…

I can't stare at a "light theme" screen for very long, I find.

Re: Using Dark Mode in CSS with MacOS Mojave

#80

Post by Cub3 »

S_A_P wrote: post #29
modernerd wrote: post #8

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.

Agreed, i've been using the DarkReader extension to make everything 'Dark Mode'

https://darkreader.org/

Post reply on HN