Hacker News new | past | comments | ask | show | jobs | submit login

Worth noting is that "prefers-color-scheme" works in all major OSes at this point, mobile and desktop. If your site already has a dark theme, there is no reason at all not to be integrating it this way.

Even if you don't have a dark theme already, it's a huge value-add..... (@dang?)




I'm sure someone will call me a slowpoke on this, but one really cool thing that I didn't know about until recently was that you can also use this in images with srcset's, to display a darker image. For example, if you want to put the "Made with Bulma"[0] tag on your website, they offer a light and dark version, which you could use like this:

  <picture>
    <source srcset="made-with-bulma__dark.png" media="(prefers-color-scheme: dark)">
    <img alt="Made with bulma" src="made-with-bulma" width="128" height="24">
  </picture>
This will automatically replace with the image src when the srcset criteria is met, but keep all the other tags!

[0]https://bulma.io/made-with-bulma/


I hadn’t known exactly what srcset did until reading this, thank you!


It's funny to me that dark themes seem to be the preferred theme type in online discussions, because in practice, most people I know prefer a light theme on a monitor set to high contrast and relatively low brightness in a well lit setting. I too prefer that, as it seems to reduce (eliminate?) my eyestrain after hours on the computer.


I think it depends a lot on age and level of eyesight. I've never once felt eye strain from looking at a dark theme, and if a room is even somewhat dark then a blindingly white screen gives me a headache. I can always fiddle with my brightness as needed for different situations, at least on my phone, but that's kind of a pain. On a desktop monitor it's usually a significantly bigger pain.


I've always heard that you should use an off-white or off-black, and that CSS like #000 or #FFF for backgrounds is a no-no.


If you do not need coloured text on your web page (due to coloured diagrams, colour coding, etc) then please do not specify colours at all. (If you do need colours, then ensure that all of the colours are specified.)


I hate it when the font color is set but not the input background. On computers with dark themes this can result in black on black text. There are workarounds in Firefox and I use them but this cost me more time than necessary.


There's no real consensus. Try this site: https://contrastrebellion.com/


Sure, but there's a whole spectrum between slightly darker grey on slightly lighter grey, and straight up #FFF on #000 or vice versa.

If I have to adjust my monitor brightness to be okay with reading something there's a major issue.


> If I have to adjust my monitor brightness to be okay with reading something there's a major issue.

Yes, but the issue is with your monitor brightness or your ambient lighting, not the content. I tune my monitor for use at night with the lights on and as a result, #000 on #FFF is perfectly comfortable at all times. There's rarely a good reason to use a PC in complete darkness and I can't think of any reasons to do it in your own home.


> in a well lit setting

I think that's the key point there. Light themes are good in light, but bad in dark situations, and vice versa. "Most" people prefer light, because they use their computer mostly in the light. Many programmers etc. prefer dark because they use their computers late in the dark a lot.

These are basically two "modes" of use, but software has been treating this as a preference, rather than a mode switch.

Through a set up of PowerShell/Bash scripts, I now have global dark/light mode switches on all my devices and I feel like this is the first time I can really use them effectively in all situations. Light when there's light, dark when there isn't. I even switch on the train as it goes through a tunnel. IMO, this is how it should be used, not as a set-and-forget preference.


The problem with bright themes used like that is that "high" contrast is still not very high at all, unless you go for OLED technology - but then you'd want to use green-on-black anyway to minimize wear on the display elements.


Or just use whatever colors you like and replace displays when necessary.

I spend way too many hours using a monitor to let it's lifecycle determine what color-scheme I'll spend those hours looking at.


> on a monitor set to high contrast and relatively low brightness in a well lit setting

That's 3 pretty big assumptions :)

Sure, in that situation light mode is great, but if I'm browsing HN on my laptop at night in bed in the dark, I would definitely prefer dark mode.


Yes, it's such an obscure feature that many of the people who enable it don't even realize it... Ever since I added dark mode to gwern.net, I've been getting or seeing complaints about how my website is broken or 'defaults to black-on-white' (it doesn't). :(


Huh... It's weird to me that someone who has that enabled on their OS (even if they didn't realize it) would be upset about it on a website.


I've had a similar thing where people were complaining our app was in English (it was for a Dutch company), apparently people get confused about the preferences they themselves have set.


hey gwern, I personally really appreciate the dark mode support.


That's silly of them. The only problem I've noticed is that images are inverted when they shouldn't be (e.g. on hover or the enlarged view).


I enjoy the prefers-color-scheme support!


Looks like we need prefers-prefers-color-scheme


But then what happens when they forget opting into the opting in?!


In all seriousness, because people keep not realizing or forgetting, we're adding a 'theme switcher' little widget. I dislike the need, but lots of people genuinely like dark mode, and this seems to be the best compromise.


It's also completely broken when using GTK themes with Firefox installed with snap.


Fascinating, they're still Win95's ability to customize color schemes.


Even Windows 3 and possibly earlier editions allowed way more theme customization than a simple choice between light or dark.


I think you a word.


Indeed. For the record, that word was 'behind'.




Join us for AI Startup School this June 16-17 in San Francisco!

Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: