I wouldn't call this part of the situation a bug. I'm sure everyone has their own opinion about which is the "right" way to handle a mismatch of OS level preference and browser level theme though.
The underlying problem is Chrome exposes no (normal) setting to override the OS level setting at all, not necessarily that the preference shall always follow the browser's theme specifically.
This issue is related to appearance setting inside Chrome itself (which sets Chrome's appearance, not how it should work with websites AFAIK). The core feature of prefers-color-scheme (following the OS-level setting) is working as intended.
It is not true that prefers-color-scheme should always follow the OS-level setting. The doc says "The method by which the user expresses their preference can vary. It might be a system-wide setting exposed by the Operating System, or a setting controlled by the user agent."[1]
So if the user sets dark mode in the browser, do they not explicitly express their preference for websites? How could they be more explicit about the setting?
I didn't meant that "only OS-level setting should be respected", what I meant is that Chrome's setting is how Chrome themes should look like, not for websites.
Chrome already has a setting to change a specific website's color-scheme, although it's only working when Developer Tools is visible (then with Cmd+Shift+P "Toggle CSS media feature prefers-color-scheme"), so CSS implementation actually follows respecting UA-level preference over OS-level setting.
But again, Chrome doesn't have a feature that lets users to choose which color-scheme they want to browse the web (so there is no bug, but it's a UX issue because their Appearance settings doesn't make it clear to the users what this setting changes) other than the setting they gave to developers. Honestly I would love to see all browsers have an option for how color-scheme settings should apply to websites.
You can set the appearance mode (light, dark, device) under chrome://settings/appearance . If you change the mode, the settings page (which is a website) adopts that mode, so a user would naturally assume this is also the mode for displaying web content.
Yes it's confusing for the end-user, as I said they should improve their UX in that setting page to make it clear what this setting changes.
However, your original comment was saying that prefers-color-scheme is bugged in Chrome is not true. It works as intended: it follows both UA-level and OS-level settings correctly.
The settings in Appearance tab is not a setting for preference when browsing the web. Many apps have a setting to choose if their app should change appearance when OS setting changed (or to override it), they could simply leave out this setting and let Chrome chrome (app ui) always follow the OS setting or always be in default light mode, instead they gave users to choose "how their Chrome browser will look like", not "how every website they visit should look like".
Windows 3 through windows 7 had pervasive support for dark mode as long as application developers didn't custom paint their user interfaces. Application developers started out almost all supporting system colors and gradually over the next 25 years or so started implementing their own custom-drawn interfaces, accelerated by embedded IE/mshtml views and then later even more by Electron. This concluded with practically zero interfaces supporting the system color scheme.
Yeah, when dark mode became "a thing" my first reaction was "...didn't we have this already?"
I was a theme junkie back in Windows 98 times, but stopped bothering since it became increasingly clear that Microsoft was not really interested in supporting them after XP.
Yeah but "dark mode" for Win3 through WinXP was primarily to support passive matrix LCDs, which required inverted color schemes to appear with enough contrast to read. That is why the built-in "high contrast" color schemes look so aggressively awful.
Custom painting isn't the only thing that broke it. You can customize the style (colors) of the native widgets to get a desired look but IIRC you could choose from system colors (follows the theme/mode automatically) or exact colors. Some applications used a mix of them which made the UI look awful if you switched away from whatever the default theme was.
Maybe the apps with the windows classic interface. I remember it starting mainly around the XP days when alls started designing these super ugly (but trendy at the time) rounded corner and bubbly interfaces that were static in resolution and colour scheme.
It makes me so angry that they named the CSS function `light-dark` instead of leaving the door open to allowing generic user- or site-specified color schemes. I mean it was right there in all the other mechanisms around this feature, they just had to read and think about why these are structured the way they are, and why "light" and "dark" were always values and not keywords in all of these..:
.... and then we've got `light-dark()`, the goofy looking dragon hanging out to the side of these majestic, forward-thinking parts of the specification.
Did they not look at the prior art and notice that "one of these things is not like the other?" All the other pieces of this puzzle, conceivably, could have one day had something like `:root { color-scheme: halloween }` or `@media (prefers-color-scheme: supercontrast)` but no, we're just going to cement `light-dark()` as the only two possible color schemes we'd ever want to switch between forever.
It’s always irked me that light and dark are given privileged positions in the namespace. They’re just themes (or schemes if you like), like all the other possible themes.
I’m not sure what kind of function you’re asking for that would support arbitrary user-defined themes. With the if() function and/or @function declarations you could build pretty much any system you want for defining theme-specific values for arbitrary themes.
Color schemes (luminance modes) and color themes (aesthetic styles) are not the same thing. Halloween theme can have light and dark schemes.
Also, prefers-contrast media query exists, which can be used in combination with the luminance modes (color-scheme): halloween-light, halloween-dark, halloween-light-high-contrast, halloween-dark-high-contrast.
40% in dark mode? Totally makes sense. I don't know why, but we fall in love with dark mode. What's the reason? Maybe it just feels way more comfortable for our eyes.
I want the opposite. I suffer from astigmatism, which makes white on black hard to read. I wish Safari could turn dark mode websites into light mode websites.
I have similar issue with dark mode applied to content - hurts my eyes. I prefer to have window chrome in dark, to make "fade away". The only application which allows me to have my cake and eat it is Firefox: I can run Windows in dark yet read web in light mode.
I wish Windows would steal this feature for the whole OS: I don't want Notepad to use dark for text, but per-app setting usually turns the whole app light.
Yeah I can’t do dark mode websites because they leave an after image for some time after reading. So I made a Force Light Mode extension that just applies an inverse to any site that forces dark mode on me. Safari 27 now has some Siri extension builder, maybe it can build it for you.
I use dark mode for everything, so I'm pretty happy about this. Some sites were clearly designed to be light, and forcing dark on them could break the experience, but that's exactly what `color-scheme: light only` is for, and it's good that Safari respects it. Other than that it feels like a win-win to me: great for dark mode users, and for devs not much changes, you just add "light only" if you don't want your site to be affected.
Everyone should checkout Dark Reader extension, it's been doing adaptive dark mode for many years, and it's customisable. It even does light mode too. Using it in Firefox on HN right now!
I just noticed that Dark Reader stopped working for me. Turns out I accidentally installed "Dark Mode", a potentially malicious clone that got blocked :/
They posted about the was in Ukraine being bad and their disappointment with the Belarusian governments participation in it. https://darkreader.org/blog/no-war/
just the average HN libertarian, nothing to be really shocked about... disappointing it is. i'm also sure that the dark reader contributor didn't choose all of this "political" stuff happening to them, but that's probably too complex thinking for @NooneAtAll5
Everyone deserves configurable and hackable apps, which is the only real way to work towards universal accessibility.
I can't personally support light modes in my own software because I can't use/test them, but I'd still add an untested one and fix bug reports about it.
I'm just curious about what people mean when they talk about astigmatism in this context, because the term is usually thrown around without qualifications (plain "astigmatism" as opposed to "irregular astigmatism" or "uncorrectable astigmatism"). So I'm curious about the astigmatism of people for whom dark mode on glowing devices is a problem. Is it typically extremely severe? Is it typically uncorrectable? Is it that people's glasses or contacts are often subtly wrong/outdated? Are many astigmatics not myopic or presbyopic enough to wear glasses all the time anyway? Astigmatism is a broad category and I'm curious about the specific impairments people who avoid dark mode have, in part because I have astigmatism and nonetheless prefer (require, really) dark mode because of other vision problems.
My astigmatism is very regular, very mild, correctable, and corrected. Dark mode is still awful for me. Gives me visual snow side effects after too long and generally just makes the astigmatism symptoms worse.
It’d be great if Apple could try this hard in the iOS messages app where there the keyboard is now only dark mode when a background is set.
For me I cannot deal with dark mode in bright environments, but equally it's fairly hard (though less hard) when using light mode in dark environments. It's why Dark Reader has been such a huge quality of life improvement for me.
No, you’re not the only one, I can’t read dark mode, it’s all blurry, makes me squint and gives me a headache. Light colors all day long. Light mode is not a mode - it’s the default.
I don't use it either, and find most website dark modes really difficult to read. The text blurs together or worse, it gets "burned in" to my vision briefly (not sure what that phenomenon is called). I especially dislike the ones that are pitch black instead of the cool grey/dark grey. I was hoping this "Adaptive Dark Mode" announcement was going to adaptively do away with the pitch black dark modes that make it impossible for me to read a website by adapting them to any other color scheme. =P
No. It’s stupid. There’s a reason we don’t write white text on black paper. There’s a reason the first Mac showing black text on a white background was such an improvement.
I don’t get the point at all (and don’t want to hear it, I’ve seen the arguments before).
It’s nice it’s there for people who want it but it baffles me it’s constantly treated like the greatest thing ever.
> There’s a reason we don’t write white text on black paper.
Because wood is bright and you can’t really print white ink on a black paper?
There might be a usability advantage but using black ink on white paper doesn’t really prove that, that’s just the easier option of the two possible choices.
It’s easier, sure. Especially at first. But we’ve had paper for a while now. Different colors of ink too. If light text on dark background was superior, we would be using it. And could have for hundreds of years for anything considered important.
I can't buy a white pencil or ballpoint pen that works as reliably as something from
Ticonderoga or Bic. White Sharpie markers do not exist. White inkjet cartridges do exist, but they're specialized items that have a high ratio of solids and this produces far worse clogging issues than the CMYK we're used to using.
> No. It’s stupid. There’s a reason we don’t write white text on black paper.
That being that black paper is more expensive than white and that we're stuck with historical precedence?
Reading white text on a black background is much, much easier for me, and the few times I've had the pleasure of doing the same with paper, I still found it to be better. I haven't tried longer texts, since nobody's publishing actual books with black paper, but I'm willing to bet it I'd feel the same about those.
This just reads to me the 'serifs are important because they make reading easier (when reading of paper)', which doesn't reflect my lived experience at all. The only reason these phenomena seem to exist are historical accident and people being used to them.
I didn’t used to mind “light mode”, but then flat design took over and the midtones and grays that often composed light mode were replaced by huge swaths of stark white and near-white grays which is blinding at normal display brightness and then too low contrast to work well with low display brightness. After a while of that I started to enable dark mode whenever a platform made it available.
If/when flat design goes the way of the dodo and light themes are designed sanely once again I’ll pick them back up.
I don't have any vision problems and still I don't get dark mode. It's harder to read. Maybe it's because I work in a bright room, but even in the evening I don't really see the point of dark mode.
It's good that it exists though. Some people have different work environments or other types of vision problems than astigmatism, and if dark mode works for them supporting it in more places is good.
Maybe we could also have a way to indicate that the user wants high contrast, but that starts becoming a lot of special cases to design for.
Hacker News itself is a prime example of a website that doesn’t support dark mode, but could do so trivially (and, IMO, would look so much better if it did!)
My HN is in dark mode, though the honors for that accomplishment go to the duckduck browser. Been reading HN on dark mode a while now (light mode burns me eyes, only way to use HN for me now is with the Duck)
P.S. the Duck browser literally has a universal dark mode setting, I don't recall a site it wasn't able to dark-force darkify for me (language is fun)
For me, most dark mode styles are awful (jet black background bright white text). I'd rather have per website toggle so I can apply my own styling when the site's styles suck.
But you can have both? Automatically switching between light and dark mode based on system preferences is handled by CSS, which you can override with your own styling.
I disagree. It's pretty terrible. I use hackerweb.app on mobile and it's much better however it doesn't support posting. Thus I have to torment myself with the regular website to post a comment such as this.
I hate that folks recommend random extensions. Browsers should include style/css editors (with the ability to save and reload styles later) for accessibility. Since we don't have that, uBlock Origin does a lot of heavy lifting, and can add a dark mode to HN and other sites.
I'd share my ruleset, however, I am missing one. Before I switched PCs (motherboard caught fire) I had one that made everything dark mode, didn't dim the text, and buttons/text inputs/other inputs were also properly inverted. I had to make it myself because googling Hacker News dark mode always led to the same broken themes. I forgot to back it up. Adding dark mode doesn't need a bunch of extensions, and while I'm sure the "stylus" extension is probably useful (I haven't used it, sounds like a CSS override extension), UBO does CSS and JS.
Indeed, I just figured I'd share the full setup. IIRC, Stylus was derived from "Stylish", which was a hugely popular CSS override extension that became spyware around 2016 and was taken down in 2018, and now Stylus (and others of course) fill the gap. It would be very nice to have this integrated into the browser, I agree.
Whoops is on me, I misunderstood your question. That theme is there, you have to long press the theme button. Just realized how unintuitive it is, gonna move it to the settings.
No thanks. When you are my age you will understand.
I have no idea why all the fucking vibed websites that swank around the web these days are unable to do a simple thing:
* Have one or more "themes" with dark and light variants
* Query the browser for a preference of light or dark and offer the default theme with the probed variant.
There is also the rather wider issue of accessibility in general. I happen to be an older bloke with astigmatism and rapidly worsening ... fucked up focussing and glasses and that. I'm lucky to have both eyes and decent colour perception and general all around acuity (for a given value of acuity).
It's 2026 FFS. Why on earth is this even being discussed as an issue? We have all these cool vibed efforts that can't even be bothered with simple basics.
People should stop using Imgur. 99% of the time when I click an Imgur link, I get a 403 Imgur is temporarily over capacity. Please try again later. I highly doubt that they are, and they are just blocking VPNs.
Buy a domain and server, rack up the server in a nearby datacenter, and host on that. Easy.
If you go with a cheap enough colo provider, you can get it down to like $200/mo (depending on electricity prices and such where you are) with an initial cost of like $800 for some used server hardware.
Personally I'm excited for this on iOS—I find that reading boring stuff in dark mode at minimum brightness on my phone is easily the most effective way for me to fall asleep (contrary to the blue light/no phones in bed advice). With an OLED screen the amount of light emitted is so much lower than any alternative I've tried. For sites like HN (some threads on HN are pretty boring) that don't have a native dark mode, my solution has been setting up the "Accessibility Shortcut" feature to invert the colors on the screen. Three clicks on the lock button and the page inverts. It works okay, but it requires manual intervention for each site depending on whether it supports dark mode.
I have been using a Safari extension called Noir on iPhone for years. Works great on HN and most sites. I have it set to a pure black for HN. Easy to disable per-site when it fails. It syncs to my phone's dark mode. I also read in bed as you've described, with Night Shift turned on and very low brightness. It's great.
You're out of luck if, like me, you have a problem with astigmatic halation. All the cool kids use dark mode.
iOS since 26 has been presenting parts of the system in dark mode despite having the device set to light only. One of the ‘best’ is that launcher groups switch to dark background, but they forgot to switch the text colour, so app names are unreadable. I had hoped iOS 27 would fix it, but no, so I'm switching to Android.
As a user, I'm really excited about this. There are still so many websites that don't support dark mode.
Having built websites myself, I know how much attention it takes to make sure every page and component looks good in both light and dark mode.
It's not perfect yet. Even in the second demo, you can see that the chart remains white, creating a stark contrast with the rest of the page. But it's a great step toward making dark mode work across the web without requiring every developer to implement it themselves.
PSA: Noir is a safari extension that does exactly this and it’s fantastic. Miles better than Dark Reader on performance and refinement. Costs a few bucks but it’s one time and totally worth it.
> When transforming text color, Adaptive Dark Mode aims for sufficient contrast as defined by the WCAG 4.5:1 contrast ratio.
The WCAG 2 contrast checker is known to be inaccurate, specifically for light on dark color combinations (i.e. dark mode) meaning 4.5:1 isn't always going to be easy to read so it's surprising they're not at least using a higher ratio. The APCA contrast checker (was being considered for WCAG 3) is more accurate at measuring readable contrast levels and the docs explain the problems with WCAG 2 more:
I was looking through 'Dark Mode' browser plugins for viewing websites last week, and the options aren't great. The 'Dark Reader' plugin that's everywhere sends a lot of silent web requests in the background that seems strange given its mostly just CSS tweaks.
I use stylus on firefox, you can search for styles or write them yourself. I often write dark mode for websites, I'm using a dark mode for hn right now. Also "large mode", it's ridiculous having websites on a 32" limited to 900 px
I'd be curious to know more about this. Dark Reader, at least on Firefox, is a recommended addon, which means it gets additional scrutiny by Mozilla. I do agree though that if it does additional web requests, it seems fishy. Do you have any details on where these requests go to or how you found them?
- Checking "Enable remote debugging" and "Enable chrome and add-on debugging toolboxes" in devtools settings, opening Browser Toolbox (Ctrl+Shift+I), and looking at the "Network" tab
or
- Enable add-on debugging and inspect the addon from `about:debugging`
Really happy to see this. Users begged me to add dark mode to my sites for years and it's been nothing but a pain to support since adding it. If other browsers pick up something similar, I look forward to the day I can finally remove "manual" dark mode support and just leave it up to the browser.
I guess if you truly don’t care about it sure, this is probably going to be an improvement, but if you are willing to invest even a bit of effort I strongly think you’d want to decide how your website looks like in dark mode.
I'd estimate I've probably spent 100+ hours testing and fixing dark mode issues over the past 5-10 years. Investing "a little bit of effort" is how I got myself into the trap of doubling+ UI QA time to make sure everything _also_ looks good in dark mode (and also in dark mode across a matrix of other configurations) every time I want to ship anything new to users.
I know some people care about dark mode (and that's why I bit the bullet to add it), but I'd honestly much rather have spent all that time working on actual features.
Why are people now so obsessed with dark modes? 20 years ago it wasn't a thing at all and computers were just as usable, if not more in some regards. If you wanted a "dark mode" you switched to a tty.
This is awesome because I like reasonable solutions that let me be lazy.
I'm sure there are designers that love dealing with two themes, and will do beautiful work within each theme.
But I'm really fine with letting the computer figure it out. CRM, back office tools, admin dashboards... many clients are approving one design and dark mode is an afterthought. Why can't the computer just... do it for me, and do a better than passable job at that.
Modern CSS has some simpler mechanisms to deal with the light/dark dichotomy now. I translated a blog to support dark mode recently and it wasn't that difficult. The two sticking points were <code> and picking foreground colors that didn't blend in, and the github icon.
The other was Github's icon. But `filter: invert(1)` does a pretty decent job of handling that as long as the icons are black and white.
Chrome also has a functional adaptive dark mode (no extension required!), but it is hidden behind an experimental flag `enable-force-dark` as an origin trial on desktop. I am surprised that the Chrome team have not surfaced this to users earlier (outside of Android Chrome, where it is available as a 'Dark Mode' toggle).
To try it, go to chrome://flags and search for Dark Mode, then enable Auto Dark Mode for Web Contents.
Alternatively, you can toggle it on using the Chrome DevTools Rendering tab, as "Enable automatic dark mode"
It’s not. The feature is implemented deep within WebKit so it makes sense to be on this blog.
> It’s precisely because Adaptive Dark Mode is happening deep within the WebKit browser engine that we are able to find creative ways to solve the most complex challenges, apply the transformations with great speed and power efficiency
A pet peeve of mine is websites thinking oh you prefer dark mode so let’s make the background pure black. I cannot take it because the contrast is too much: #fff on #000 is way more uncomfortable than #000 on #fff for me. There are certain developers who continue to think that dark mode is for conserving battery life with an OLED screen so pure black is preferable. I hate that so much that I have turned off dark mode globally. If websites can’t be bothered to implement an actually nice dark theme like Solarized Dark, I’d rather prefer the light mode.
Besides Solarized Dark, GitHub’s Soft Dark theme is quite well done, but unfortunately it’s not the default for a logged-out user with dark mode. So with dark mode I need to log in to GitHub to get acceptable colors.
Now that I think about it, I need a feature to limit the darkness of colors anywhere on the page, background or text except images. Remap #000 to #222 and #fff to #ddd.
If this ends up working anything like the Gmail Dark Mode implementations on iOS and Android that have drove developers insane and users mad, then I expect both parties to become upset. It is easy to view this as a win for users, but the moment this doesn't work well in various scenarios, the vocal minority will punish the developers of the web as if they did something wrong here, and everyone loses.
Here is to hoping that is not the case, and they did a good job with the implementation in Safari, but I have my suspicions.
Your imagination for what can go wrong seems limited in my eyes. I've been in the trenches where a specification was not followed, or was wrong from the beginning. That can be the case here.
Can we get apple to enforce consistent 'back' behavior in iOS next?
I just switched after being an Android user since the dawn of the smartphone era. There are some improvements over Android so I'll give them credit but holy hell is navigation just a complete mess. Every app seems to behave differently, and even within the same app you'll see inconsistencies.
Would it really be that hard to provide a universal back gesture that works across apps like Android has? It makes the phone so clunkly and slow.
• As a web developer: what a nightmare, now your website will look different to different people, as if having to support multiple browser engines and multiple screen rations, and multiple platforms, etc. was not a big pile of problems already.
• As someone who doesn’t like dark-mode due to eye strain: good-good… for people who like it ¯\_(ツ)_/¯
> The HTML <meta name="color-scheme" content="light only"> tag lets browsers know that 1) this page supports light mode and 2) should only be displayed in light mode.
Even as a developer I'm all for it, go even harder. We may eventually reach the promised land where the user agent defines so much of the final appearance things like "pixel perfect design" or beating standard controls into within an inch of their lives to fit some design system are a thing of the past.
I like to think of it as a gentle encouragement to finally implement prefers-color-scheme in web applications.
(I say this as a designer who has spent countless hours on dark-mode palettes as well as someone who has the automatic circadian toggle enabled everywhere.)
disagree. the web specifically is built as a dynamic medium for consumption. The fluid nature is the point. Yes, it is harder for developers to force a consistent experience, but as a professional web dev, we should not treat the web as a fixed medium.
Who cares if you can? I am referring to non-tech-savvy web users who barely know what YouTube is: your parents, grandparents, accountant, or city firefighters. There are literally millions of people in this planet who don’t even know what HTML is. The commenters above appear to be criticizing my remark as if I was mistaken. Software developers often lack imagination when it comes to real-world problems.
> what a nightmare, now your website will look different to different people
That's what the web has always been. People don't all have the same display types, the same subpixel layouts, the same display sizes, the same DPIs, the same fonts, the same zoom levels... People use reader modes, global restyling extensions, per-site custom style sheets, full screen magnifiers, bounded/partial magnifiers, screen readers, OS high-contrast modes... the web has never been a fixed canvas that you get to paint on and then hand to users.
> Safari prevents websites from detecting when Adaptive Dark Mode has been applied. JavaScript that queries CSS colors will get the original authored colors, not the transformed ones. Any images drawn into canvas render in their original form.
So… the browser is now intentionally lying now. Ain’t that great.
Browsers already intentionally lie all the time, and have had to for years, because fingerprinting and tracking by various ad networks and bad actors has been rampant.
Browsers lie all the time. Browsers also prevent sites from getting the color of a link because visited links can be shown in a different color and this can be used by the site to tell if a user has ever visited a link.
Don’t you love it when browsers lie to websites to enhance the user’s privacy.
This is much better than the absolute embarrassment Mozilla tried with alternate page styles. I swear no one at Mozilla ever tested out the feature considering the style you select does not get persisted so the next time you navigate it reverts back to the original style.
Meanwhile this features is actually tired to a persisted device setting that doesn't get reset every time you go to a new page.
Wikipedia allows you to write any custom CSS. In 2012/2013 when Facebook IPO’ed and was the cool thing I made a user CSS that made Wikipedia look like Facebook.
"Websites aren't making dark mode versions! WE'LL DO IT FOR THEM!"
This has to be the result of some passion project by yet another whacko dark mode fanatic (you know who you are). Non-standard, assuredly buggy, and basically a maintenance nightmare. Good luck with that craziness.
Can we have another setting which turns dark websites into actually readable light designs for adults?
For anyone using Zen browser, you can accomplish this on a site by site basis using the newer "Boosts" feature available via the extensions button in the url bar
Personally, I find it close to perfect for Gmail and HN, among others
This is surely going to be optional, so it won't impact me in the slightest, but it is a pet peeve of mine when browsers (or browser extensions, looking at you 1Password) alter the UI of websites away from how they were originally designed without explicit instruction to do so.
This sounds like it meets that threshold, it will just surely be a hit-or-miss mess. Hopefully if it makes it to iOS it will drive more site owners to adapt to `prefers-color-scheme`.
I'm very in favor of users being able to do whatever they want with websites - I'm all for it. I just don't like extensions making changes without a clean way to disable it, like in 1P
FYI, light-dark() in CSS is a thing now.
https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/V...
And `:prefers-color-scheme` has been supported by all major browsers for seven years.
And broken in Chrome since the beginning:
https://issues.chromium.org/issues/366412383
So I guess it hasn’t been supported anywhere in a sense.
Safari and Firefox are pretty small.
I wouldn't call this part of the situation a bug. I'm sure everyone has their own opinion about which is the "right" way to handle a mismatch of OS level preference and browser level theme though.
The underlying problem is Chrome exposes no (normal) setting to override the OS level setting at all, not necessarily that the preference shall always follow the browser's theme specifically.
This issue is related to appearance setting inside Chrome itself (which sets Chrome's appearance, not how it should work with websites AFAIK). The core feature of prefers-color-scheme (following the OS-level setting) is working as intended.
It is not true that prefers-color-scheme should always follow the OS-level setting. The doc says "The method by which the user expresses their preference can vary. It might be a system-wide setting exposed by the Operating System, or a setting controlled by the user agent."[1]
So if the user sets dark mode in the browser, do they not explicitly express their preference for websites? How could they be more explicit about the setting?
[1]https://drafts.csswg.org/mediaqueries-5/#prefers-color-schem...
I didn't meant that "only OS-level setting should be respected", what I meant is that Chrome's setting is how Chrome themes should look like, not for websites.
Chrome already has a setting to change a specific website's color-scheme, although it's only working when Developer Tools is visible (then with Cmd+Shift+P "Toggle CSS media feature prefers-color-scheme"), so CSS implementation actually follows respecting UA-level preference over OS-level setting.
But again, Chrome doesn't have a feature that lets users to choose which color-scheme they want to browse the web (so there is no bug, but it's a UX issue because their Appearance settings doesn't make it clear to the users what this setting changes) other than the setting they gave to developers. Honestly I would love to see all browsers have an option for how color-scheme settings should apply to websites.
You can set the appearance mode (light, dark, device) under chrome://settings/appearance . If you change the mode, the settings page (which is a website) adopts that mode, so a user would naturally assume this is also the mode for displaying web content.
Yes it's confusing for the end-user, as I said they should improve their UX in that setting page to make it clear what this setting changes.
However, your original comment was saying that prefers-color-scheme is bugged in Chrome is not true. It works as intended: it follows both UA-level and OS-level settings correctly.
The settings in Appearance tab is not a setting for preference when browsing the web. Many apps have a setting to choose if their app should change appearance when OS setting changed (or to override it), they could simply leave out this setting and let Chrome chrome (app ui) always follow the OS setting or always be in default light mode, instead they gave users to choose "how their Chrome browser will look like", not "how every website they visit should look like".
Windows 3 through windows 7 had pervasive support for dark mode as long as application developers didn't custom paint their user interfaces. Application developers started out almost all supporting system colors and gradually over the next 25 years or so started implementing their own custom-drawn interfaces, accelerated by embedded IE/mshtml views and then later even more by Electron. This concluded with practically zero interfaces supporting the system color scheme.
Yeah, when dark mode became "a thing" my first reaction was "...didn't we have this already?"
I was a theme junkie back in Windows 98 times, but stopped bothering since it became increasingly clear that Microsoft was not really interested in supporting them after XP.
Yeah but "dark mode" for Win3 through WinXP was primarily to support passive matrix LCDs, which required inverted color schemes to appear with enough contrast to read. That is why the built-in "high contrast" color schemes look so aggressively awful.
Custom painting isn't the only thing that broke it. You can customize the style (colors) of the native widgets to get a desired look but IIRC you could choose from system colors (follows the theme/mode automatically) or exact colors. Some applications used a mix of them which made the UI look awful if you switched away from whatever the default theme was.
Maybe the apps with the windows classic interface. I remember it starting mainly around the XP days when alls started designing these super ugly (but trendy at the time) rounded corner and bubbly interfaces that were static in resolution and colour scheme.
Works best at 1024x768!
It makes me so angry that they named the CSS function `light-dark` instead of leaving the door open to allowing generic user- or site-specified color schemes. I mean it was right there in all the other mechanisms around this feature, they just had to read and think about why these are structured the way they are, and why "light" and "dark" were always values and not keywords in all of these..:
.... and then we've got `light-dark()`, the goofy looking dragon hanging out to the side of these majestic, forward-thinking parts of the specification.
Did they not look at the prior art and notice that "one of these things is not like the other?" All the other pieces of this puzzle, conceivably, could have one day had something like `:root { color-scheme: halloween }` or `@media (prefers-color-scheme: supercontrast)` but no, we're just going to cement `light-dark()` as the only two possible color schemes we'd ever want to switch between forever.
It’s always irked me that light and dark are given privileged positions in the namespace. They’re just themes (or schemes if you like), like all the other possible themes.
I'd argue that they are modes of themes, not themes themselves.
I’m not sure what kind of function you’re asking for that would support arbitrary user-defined themes. With the if() function and/or @function declarations you could build pretty much any system you want for defining theme-specific values for arbitrary themes.
Web standards are discussed in the open aren't they? I'll see if I can find what reasoning lead to this.
https://github.com/w3c/csswg-drafts/issues/7561 appears to be a place to start digging
Color schemes (luminance modes) and color themes (aesthetic styles) are not the same thing. Halloween theme can have light and dark schemes.
Also, prefers-contrast media query exists, which can be used in combination with the luminance modes (color-scheme): halloween-light, halloween-dark, halloween-light-high-contrast, halloween-dark-high-contrast.
https://news.ycombinator.com/item?id=47832705
A real loss for colour blind people. This could have been a vehicle for colourblind-aware themes.
40% in dark mode? Totally makes sense. I don't know why, but we fall in love with dark mode. What's the reason? Maybe it just feels way more comfortable for our eyes.
I want the opposite. I suffer from astigmatism, which makes white on black hard to read. I wish Safari could turn dark mode websites into light mode websites.
I have similar issue with dark mode applied to content - hurts my eyes. I prefer to have window chrome in dark, to make "fade away". The only application which allows me to have my cake and eat it is Firefox: I can run Windows in dark yet read web in light mode.
I wish Windows would steal this feature for the whole OS: I don't want Notepad to use dark for text, but per-app setting usually turns the whole app light.
I have 20/20 but for some reason cannot handle dark mode except for two things, terminal and coding and I cannot do light mode for either of those.
But whether it is my os ui or my phone ui, I feel like I can't distinguish borders and boundaries in the UI as well as I can with light mode.
Yeah I can’t do dark mode websites because they leave an after image for some time after reading. So I made a Force Light Mode extension that just applies an inverse to any site that forces dark mode on me. Safari 27 now has some Siri extension builder, maybe it can build it for you.
Dark Reader extension can do that
I’ve been using these for decades:
https://www.squarefree.com/bookmarklets/zap.html
I use dark mode for everything, so I'm pretty happy about this. Some sites were clearly designed to be light, and forcing dark on them could break the experience, but that's exactly what `color-scheme: light only` is for, and it's good that Safari respects it. Other than that it feels like a win-win to me: great for dark mode users, and for devs not much changes, you just add "light only" if you don't want your site to be affected.
Everyone should checkout Dark Reader extension, it's been doing adaptive dark mode for many years, and it's customisable. It even does light mode too. Using it in Firefox on HN right now!
Slows down loading of websites a lot though.
A slowly loading website is preferable to a quick flashbang.
There's an open offer for mentoring if someone would like to implement this natively in Firefox, FWIW: https://bugzilla.mozilla.org/show_bug.cgi?id=1591679#c13
I just noticed that Dark Reader stopped working for me. Turns out I accidentally installed "Dark Mode", a potentially malicious clone that got blocked :/
I like that on Chrome, and while it works on Safari, I prefer Noir there.
I'm concerned that these extensions can "read and modify" everything. I can't use that for work.
AFAIK, its detectable by the web page though
Dark Reader went political - that's an automatic "NO" from me
What do you mean?
They posted about the was in Ukraine being bad and their disappointment with the Belarusian governments participation in it. https://darkreader.org/blog/no-war/
I'm a little shocked and disappointed to find that's considered "going political". Sigh.
just the average HN libertarian, nothing to be really shocked about... disappointing it is. i'm also sure that the dark reader contributor didn't choose all of this "political" stuff happening to them, but that's probably too complex thinking for @NooneAtAll5
I'm just donated because it is so important nowadays to not stay silent. Thank You DarkReader
Chrome has a built in dark mode that's more performant than extensions.
chrome://flags/#enable-force-dark
Works great 99% of the every time.
Am I still the only one who doesn't use dark mode? My astigmatism can't take it
No.
Is your astigmatism uncorrectable?
Even if it were, it’s easier and more reasonable to fix your app to work with your users, than fixing your users to work with your app.
Everyone deserves configurable and hackable apps, which is the only real way to work towards universal accessibility.
I can't personally support light modes in my own software because I can't use/test them, but I'd still add an untested one and fix bug reports about it.
I'm just curious about what people mean when they talk about astigmatism in this context, because the term is usually thrown around without qualifications (plain "astigmatism" as opposed to "irregular astigmatism" or "uncorrectable astigmatism"). So I'm curious about the astigmatism of people for whom dark mode on glowing devices is a problem. Is it typically extremely severe? Is it typically uncorrectable? Is it that people's glasses or contacts are often subtly wrong/outdated? Are many astigmatics not myopic or presbyopic enough to wear glasses all the time anyway? Astigmatism is a broad category and I'm curious about the specific impairments people who avoid dark mode have, in part because I have astigmatism and nonetheless prefer (require, really) dark mode because of other vision problems.
My astigmatism is very regular, very mild, correctable, and corrected. Dark mode is still awful for me. Gives me visual snow side effects after too long and generally just makes the astigmatism symptoms worse.
It’d be great if Apple could try this hard in the iOS messages app where there the keyboard is now only dark mode when a background is set.
Not them, but my left eye isn't fully correctable. The average dark mode site looks like I'm driving the Las Vegas strip in the rain.
For me I cannot deal with dark mode in bright environments, but equally it's fairly hard (though less hard) when using light mode in dark environments. It's why Dark Reader has been such a huge quality of life improvement for me.
I find dark mode is better for astigmatism, personally. It also isn't hellish if you have floaters and migraines, unlike light mode.
The preference, either way, is an important accessibility feature.
No, you’re not the only one, I can’t read dark mode, it’s all blurry, makes me squint and gives me a headache. Light colors all day long. Light mode is not a mode - it’s the default.
I don't use it either, and find most website dark modes really difficult to read. The text blurs together or worse, it gets "burned in" to my vision briefly (not sure what that phenomenon is called). I especially dislike the ones that are pitch black instead of the cool grey/dark grey. I was hoping this "Adaptive Dark Mode" announcement was going to adaptively do away with the pitch black dark modes that make it impossible for me to read a website by adapting them to any other color scheme. =P
No, After a few minutes of dark mode, I get essentially zebra stripe like migraines.
No. It’s stupid. There’s a reason we don’t write white text on black paper. There’s a reason the first Mac showing black text on a white background was such an improvement.
I don’t get the point at all (and don’t want to hear it, I’ve seen the arguments before).
It’s nice it’s there for people who want it but it baffles me it’s constantly treated like the greatest thing ever.
> There’s a reason we don’t write white text on black paper.
Because wood is bright and you can’t really print white ink on a black paper?
There might be a usability advantage but using black ink on white paper doesn’t really prove that, that’s just the easier option of the two possible choices.
It’s easier, sure. Especially at first. But we’ve had paper for a while now. Different colors of ink too. If light text on dark background was superior, we would be using it. And could have for hundreds of years for anything considered important.
The playing field isn't level.
I can't buy a white pencil or ballpoint pen that works as reliably as something from Ticonderoga or Bic. White Sharpie markers do not exist. White inkjet cartridges do exist, but they're specialized items that have a high ratio of solids and this produces far worse clogging issues than the CMYK we're used to using.
> There’s a reason the first Mac showing black text on a white background was such an improvement
Apple soon started offering a dark mode as an accessibility feature https://kalleboo.com/linked/mac_closeview_control_panel.png
That’s an accessibility feature.
It was not an intended way to use things all the time for a large chunk of the user population.
Not the same.
Yeah, just wait until you are not the target market.
Accessibility features are often the bellwether of the needs of abled users as well.
When Apple introduced Liquid Glass, "reduce transparency" was also an accessibility feature.
> No. It’s stupid. There’s a reason we don’t write white text on black paper.
That being that black paper is more expensive than white and that we're stuck with historical precedence?
Reading white text on a black background is much, much easier for me, and the few times I've had the pleasure of doing the same with paper, I still found it to be better. I haven't tried longer texts, since nobody's publishing actual books with black paper, but I'm willing to bet it I'd feel the same about those.
This just reads to me the 'serifs are important because they make reading easier (when reading of paper)', which doesn't reflect my lived experience at all. The only reason these phenomena seem to exist are historical accident and people being used to them.
Notably, also the Xerox Alto was black on white already.
I use light mode in the day when it’s bright, and dark mode at night when it’s dark. Neither mode is “better” for me, but two things are true for me:
- Dark mode is harder to read when it’s bright out
- Light mode is blindingly bright when I’m in a dark room (and turning the brightness sufficiently low makes everything look washed out.)
My devices change from light mode to dark mode at sunset and it’s basically ideal.
Also it’s nice to just have less artificial light as the sun sets, which makes falling asleep naturally a bit easier.
That's why every site should respect the user's light/dark preference when possible. Dark mode vs light mode is very divisive
I have the opposite issue. That's why I have my system theme set to dark, and likely you to light, and this has existed for years:
https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/A...
It's 2026, how does every single website, especially this one, not support this?
I didn’t used to mind “light mode”, but then flat design took over and the midtones and grays that often composed light mode were replaced by huge swaths of stark white and near-white grays which is blinding at normal display brightness and then too low contrast to work well with low display brightness. After a while of that I started to enable dark mode whenever a platform made it available.
If/when flat design goes the way of the dodo and light themes are designed sanely once again I’ll pick them back up.
Yeah same here, the only time I use dark mode is usually when I feel a migraine attack might be coming up (and I get very sensitive to light)
I use solarized light.
Back in the day (work from office lol) people would always pick on me for that, playfully of course.
I don't have any vision problems and still I don't get dark mode. It's harder to read. Maybe it's because I work in a bright room, but even in the evening I don't really see the point of dark mode.
It's good that it exists though. Some people have different work environments or other types of vision problems than astigmatism, and if dark mode works for them supporting it in more places is good.
Maybe we could also have a way to indicate that the user wants high contrast, but that starts becoming a lot of special cases to design for.
Hacker News itself is a prime example of a website that doesn’t support dark mode, but could do so trivially (and, IMO, would look so much better if it did!)
Please no. Dark mode is extremely difficult to read for me.
Are you supposing they would they force it on for you? Or does your dislike of it mean nobody else should have the option?
This is, in fact, what drives a lot of politics. "I don't like X therefore nobody may have X."
Bean Soup Theory: https://www.merriam-webster.com/slang/bean-soup-theory
That’s why it’s a mode :-)
I'd prefer dark mode because then I notice my eye floaters much less when reading.
Ironically this comment is now almost impossible to read.
there are a lot of design choices which Hacker News does not support ;)
My HN is in dark mode, though the honors for that accomplishment go to the duckduck browser. Been reading HN on dark mode a while now (light mode burns me eyes, only way to use HN for me now is with the Duck)
P.S. the Duck browser literally has a universal dark mode setting, I don't recall a site it wasn't able to dark-force darkify for me (language is fun)
There is no downside to having prefers-color-scheme media query set up, even for HN. Too bad still roughly 1 in 4 popular websites support it.
no, choosing light/dark mode should be manual
Per website...? Why would anyone want that instead of just using the system-wide preference? Many sites/apps have an option of system/light/dark.
For me, most dark mode styles are awful (jet black background bright white text). I'd rather have per website toggle so I can apply my own styling when the site's styles suck.
But you can have both? Automatically switching between light and dark mode based on system preferences is handled by CSS, which you can override with your own styling.
Hard disagree here. Follow my system default.
Iam a both kind of guy.
No, it should follow system defaults with an option for a manual override. People like you are the reason the internet is broken.
They’re now formally interested in doing one but, I imagine, not very urgently relative to flag reasons and other stuff.
I got neurological lyme disease a few years ago. Anything with a white background was like a VGA cable being half plugged in.
The fact that this website wasn’t capable of dark mode made me create a CSS overlay on desktop.
I am back to somewhat normal now with my eyes, but I feel really bad for anyone in the same position.
I know that the current exact HN is magic, but come on. There is CSS to detect the system’s theme. There is no need to create a button or anything.
Dark mode and some small improvements for mobile usage would be amazing and don't seem at all hard. It's pretty amazing HN hasn't implemented them.
HN works just fine on mobile. I am posting from a GrapheneOS phone. If it ain't broke, don't fix it.
I misclicked "hide" on quite a few articles when I meant to read the comments
I disagree. It's pretty terrible. I use hackerweb.app on mobile and it's much better however it doesn't support posting. Thus I have to torment myself with the regular website to post a comment such as this.
If anyone here is open to using the Stylus extension, I've re-shared a dark theme for Hacker News recently and it's been lovely. [0]
[0] https://news.ycombinator.com/item?id=49686639
I hate that folks recommend random extensions. Browsers should include style/css editors (with the ability to save and reload styles later) for accessibility. Since we don't have that, uBlock Origin does a lot of heavy lifting, and can add a dark mode to HN and other sites.
I'd share my ruleset, however, I am missing one. Before I switched PCs (motherboard caught fire) I had one that made everything dark mode, didn't dim the text, and buttons/text inputs/other inputs were also properly inverted. I had to make it myself because googling Hacker News dark mode always led to the same broken themes. I forgot to back it up. Adding dark mode doesn't need a bunch of extensions, and while I'm sure the "stylus" extension is probably useful (I haven't used it, sounds like a CSS override extension), UBO does CSS and JS.
Just my thoughts. Don't mind me.
I still miss Omniweb, a browser with user defined stylesheets, per site settings, and workspaces… so many good things. Free browsers killed it off.
Opera had this in 2003, but sadly none of the major browsers copied it.
Indeed, I just figured I'd share the full setup. IIRC, Stylus was derived from "Stylish", which was a hugely popular CSS override extension that became spyware around 2016 and was taken down in 2018, and now Stylus (and others of course) fill the gap. It would be very nice to have this integrated into the browser, I agree.
Safari and Firefox both support loading user styles from disk.
The latest Safari also supports creating limited extensions on the fly via AI.
https://hcker.news was originally made so i didnt solar flash my kid in bed while they were sleeping
it now has many dark themes, bloomberg is my favorite.
It's great!
Where are the themes? (I might be missing on mobile)
my bad, upper right corner half moon icon!
Gotcha I was looking for a Bloomberg terminal like theme, whoops
Whoops is on me, I misunderstood your question. That theme is there, you have to long press the theme button. Just realized how unintuitive it is, gonna move it to the settings.
No thanks. When you are my age you will understand.
I have no idea why all the fucking vibed websites that swank around the web these days are unable to do a simple thing:
There is also the rather wider issue of accessibility in general. I happen to be an older bloke with astigmatism and rapidly worsening ... fucked up focussing and glasses and that. I'm lucky to have both eyes and decent colour perception and general all around acuity (for a given value of acuity).
It's 2026 FFS. Why on earth is this even being discussed as an issue? We have all these cool vibed efforts that can't even be bothered with simple basics.
I use Stylus to apply a dark theme to HN, and much prefer it. https://i.imgur.com/USbXXEK.png
People should stop using Imgur. 99% of the time when I click an Imgur link, I get a 403 Imgur is temporarily over capacity. Please try again later. I highly doubt that they are, and they are just blocking VPNs.
If you've got a better suggestion, I'm open to it. I generally just want a throwaway place to host an image publicly for a specific purpose.
Buy a domain and server, rack up the server in a nearby datacenter, and host on that. Easy.
If you go with a cheap enough colo provider, you can get it down to like $200/mo (depending on electricity prices and such where you are) with an initial cost of like $800 for some used server hardware.
I use a chrome plugin precisely for this and I can confirm - my eyes hurt less
The only chrome extension I have is to make hackernews support dark mode. Love having it
I do appreciate how minimalist hackernews tries to be, but I think respecting the operating system's theme can be considered very minimalist
Not sure if you would like my dark mode modifications to HN, but here are my CSS[1] and JS[2] modifications.
Javascript: https://pastebin.com/50EUfktL CSS: https://pastebin.com/nzEhxxBY
This feature works well on Hacker News, just trying it on the beta.
Personally I'm excited for this on iOS—I find that reading boring stuff in dark mode at minimum brightness on my phone is easily the most effective way for me to fall asleep (contrary to the blue light/no phones in bed advice). With an OLED screen the amount of light emitted is so much lower than any alternative I've tried. For sites like HN (some threads on HN are pretty boring) that don't have a native dark mode, my solution has been setting up the "Accessibility Shortcut" feature to invert the colors on the screen. Three clicks on the lock button and the page inverts. It works okay, but it requires manual intervention for each site depending on whether it supports dark mode.
I have been using a Safari extension called Noir on iPhone for years. Works great on HN and most sites. I have it set to a pure black for HN. Easy to disable per-site when it fails. It syncs to my phone's dark mode. I also read in bed as you've described, with Night Shift turned on and very low brightness. It's great.
Does it go the other way? What if I want light mode on a website that looks dark
You're out of luck if, like me, you have a problem with astigmatic halation. All the cool kids use dark mode.
iOS since 26 has been presenting parts of the system in dark mode despite having the device set to light only. One of the ‘best’ is that launcher groups switch to dark background, but they forgot to switch the text colour, so app names are unreadable. I had hoped iOS 27 would fix it, but no, so I'm switching to Android.
Yeah, same here. Insanely annoying to have your own phone get made less accessible for you.
This is a good thing.
I added dark mode to my blog a while ago and it was a little trying to do properly.
You can implement a half-assed dark mode yourself by adding the following css.
All your images will be inverted as well, which doesn’t work well for photos.
For images. Works better for illustrations to get the vibe of the original colours than actual photographs.
Yep! That’s what is my dark mode userscript too. Reference for anyone interested in more details. https://monochrome.sutic.nu/2024/02/25/hue-preserving-invert...
The opt outs mentioned in the article, like
should be sufficient to enable dark mode for users who prefer dark mode.
For icons, ideally they’d be SVGs controlled by currentColor, but that may not be feasible or convenient depending on your setup.
Please do not use invert; it messes up subpixel rendering, making text ugly and harder to read.
As a user, I'm really excited about this. There are still so many websites that don't support dark mode.
Having built websites myself, I know how much attention it takes to make sure every page and component looks good in both light and dark mode.
It's not perfect yet. Even in the second demo, you can see that the chart remains white, creating a stark contrast with the rest of the page. But it's a great step toward making dark mode work across the web without requiring every developer to implement it themselves.
PSA: Noir is a safari extension that does exactly this and it’s fantastic. Miles better than Dark Reader on performance and refinement. Costs a few bucks but it’s one time and totally worth it.
>cost a few bucks
Sounds like the Noir dev is going to be the next victim of Apple's Sherlocking.
> When transforming text color, Adaptive Dark Mode aims for sufficient contrast as defined by the WCAG 4.5:1 contrast ratio.
The WCAG 2 contrast checker is known to be inaccurate, specifically for light on dark color combinations (i.e. dark mode) meaning 4.5:1 isn't always going to be easy to read so it's surprising they're not at least using a higher ratio. The APCA contrast checker (was being considered for WCAG 3) is more accurate at measuring readable contrast levels and the docs explain the problems with WCAG 2 more:
https://git.apcacontrast.com/documentation/APCAeasyIntro.htm...
I was looking through 'Dark Mode' browser plugins for viewing websites last week, and the options aren't great. The 'Dark Reader' plugin that's everywhere sends a lot of silent web requests in the background that seems strange given its mostly just CSS tweaks.
Bad: it’s tracking you
Worse: it’s attacking you
Worst: it’s attacking someone else as you
I use stylus on firefox, you can search for styles or write them yourself. I often write dark mode for websites, I'm using a dark mode for hn right now. Also "large mode", it's ridiculous having websites on a 32" limited to 900 px
I'd be curious to know more about this. Dark Reader, at least on Firefox, is a recommended addon, which means it gets additional scrutiny by Mozilla. I do agree though that if it does additional web requests, it seems fishy. Do you have any details on where these requests go to or how you found them?
You can inspect requests yourself by either:
- Checking "Enable remote debugging" and "Enable chrome and add-on debugging toolboxes" in devtools settings, opening Browser Toolbox (Ctrl+Shift+I), and looking at the "Network" tab
or
- Enable add-on debugging and inspect the addon from `about:debugging`
Correction: C+A+S+I
What’s the relationship for Safari and Safari Tech Preview.
Because correct me if I’m wrong, neither of these features were in the Tech Preview.
And numerous features have been in Tech Preview that have never made it into mainline Safari.
Safari Technology Preview is primarily for testing the latest WebKit features, rather than previewing every upcoming Safari feature.
Safari Beta is generally what you'd want to use to test features coming to the next Safari release.
And yes, features appearing in Technology Preview aren't necessarily guaranteed to ship in Safari.
On iOS, the webbrowsers Firefox, Brave, and Duckduckgo already provided this natively. Too bad not yet on macOS.
Does this also address the momentary flash of blinding white, often when pages transition/fail to render
CSS variables for colors, that's all you need to design both light and dark modes.
Really happy to see this. Users begged me to add dark mode to my sites for years and it's been nothing but a pain to support since adding it. If other browsers pick up something similar, I look forward to the day I can finally remove "manual" dark mode support and just leave it up to the browser.
> I look forward to the day I can finally remove "manual" dark mode support and just leave it up to the browser.
Today it is!
https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/V...
https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/A...
I guess if you truly don’t care about it sure, this is probably going to be an improvement, but if you are willing to invest even a bit of effort I strongly think you’d want to decide how your website looks like in dark mode.
I'd estimate I've probably spent 100+ hours testing and fixing dark mode issues over the past 5-10 years. Investing "a little bit of effort" is how I got myself into the trap of doubling+ UI QA time to make sure everything _also_ looks good in dark mode (and also in dark mode across a matrix of other configurations) every time I want to ship anything new to users.
I know some people care about dark mode (and that's why I bit the bullet to add it), but I'd honestly much rather have spent all that time working on actual features.
Finally a fix for HN
Please! I don't use Safari so this won't help me, but switching back to HN from other mostly dark themed sites hurts my eyes :(
Why are people now so obsessed with dark modes? 20 years ago it wasn't a thing at all and computers were just as usable, if not more in some regards. If you wanted a "dark mode" you switched to a tty.
Not true. Also 20 years ago we were still using 14” CRTs.
People had filters on their monitors 20 years ago
Yes!! It was about time
This is awesome because I like reasonable solutions that let me be lazy.
I'm sure there are designers that love dealing with two themes, and will do beautiful work within each theme.
But I'm really fine with letting the computer figure it out. CRM, back office tools, admin dashboards... many clients are approving one design and dark mode is an afterthought. Why can't the computer just... do it for me, and do a better than passable job at that.
Modern CSS has some simpler mechanisms to deal with the light/dark dichotomy now. I translated a blog to support dark mode recently and it wasn't that difficult. The two sticking points were <code> and picking foreground colors that didn't blend in, and the github icon.
The other was Github's icon. But `filter: invert(1)` does a pretty decent job of handling that as long as the icons are black and white.
Chrome also has a functional adaptive dark mode (no extension required!), but it is hidden behind an experimental flag `enable-force-dark` as an origin trial on desktop. I am surprised that the Chrome team have not surfaced this to users earlier (outside of Android Chrome, where it is available as a 'Dark Mode' toggle).
To try it, go to chrome://flags and search for Dark Mode, then enable Auto Dark Mode for Web Contents.
Alternatively, you can toggle it on using the Chrome DevTools Rendering tab, as "Enable automatic dark mode"
Some pages break badly... like google docs and some QR codes
Finally..
In dark mode, any windows that aren't dark can be huge eyesores.
I recently made a menu bar utility to enable per-window color invert for this reason: https://github.com/pazimzadeh/WindowInvert/
It helps for apps that don't have dark mode yet (Pages, etc) and even some apps that do (Preview has a dark mode, but it doesn't work on old PDF's).
I just wish all websites supported reader mode.
I know it's always been this way, but it's weird to me that Apple uses the WebKit blog for Safari product announcements.
It’s not. The feature is implemented deep within WebKit so it makes sense to be on this blog.
> It’s precisely because Adaptive Dark Mode is happening deep within the WebKit browser engine that we are able to find creative ways to solve the most complex challenges, apply the transformations with great speed and power efficiency
Wowww innovative
Why can’t HN provide a dark mode?
A pet peeve of mine is websites thinking oh you prefer dark mode so let’s make the background pure black. I cannot take it because the contrast is too much: #fff on #000 is way more uncomfortable than #000 on #fff for me. There are certain developers who continue to think that dark mode is for conserving battery life with an OLED screen so pure black is preferable. I hate that so much that I have turned off dark mode globally. If websites can’t be bothered to implement an actually nice dark theme like Solarized Dark, I’d rather prefer the light mode.
Besides Solarized Dark, GitHub’s Soft Dark theme is quite well done, but unfortunately it’s not the default for a logged-out user with dark mode. So with dark mode I need to log in to GitHub to get acceptable colors.
Now that I think about it, I need a feature to limit the darkness of colors anywhere on the page, background or text except images. Remap #000 to #222 and #fff to #ddd.
This is great.
I use the brave beta appearance option "Dark Mode" and every now and then a site is almost unreadable.
I fear this will lead to a lot of broken websites. That seems to be the case with a lot of the browser plugins that provide the same functionality.
There's a mode like this in an Android Chrome fork called Cromite that works surprisingly well. Most of the other options do suck though.
1. It's opt-in. The user is choosing the occasional broken site over light themes.
2. The site can always provide their own dark theme if the automatic one is broken.
This looks awesome! I especially like that its not detectectable by the page for privacy! I want this in firefox.
They say it can’t be detected but give it time and someone will figure out some signal that gives it away.
If this ends up working anything like the Gmail Dark Mode implementations on iOS and Android that have drove developers insane and users mad, then I expect both parties to become upset. It is easy to view this as a win for users, but the moment this doesn't work well in various scenarios, the vocal minority will punish the developers of the web as if they did something wrong here, and everyone loses.
Here is to hoping that is not the case, and they did a good job with the implementation in Safari, but I have my suspicions.
>will punish the developers of the web as if they did something wrong here
Yes, developers can solve this by simply implementing dark mode.
Your imagination for what can go wrong seems limited in my eyes. I've been in the trenches where a specification was not followed, or was wrong from the beginning. That can be the case here.
I wonder when Apple will separate Safari update from iOS update. They have done this for the MacOS.
I wonder when they will separate other browsers on iOS from clusterfxxk Safari is
Oh man! Dark reader's getting Sherlocked now!
It is truly arrogant of Apple to change a websites presentation, graphics, logos, and then tell website authors if you want to opt out just do XYZ.
But this Apple arrogance is also why they are Apple. And why you are using a software keyboard and a phone shaped like a dark mirror.
Its truly arrogant of website authors to think they should have the final say on how users view the site on their browser.
Really exciting! Now do apps.
Can we get apple to enforce consistent 'back' behavior in iOS next?
I just switched after being an Android user since the dawn of the smartphone era. There are some improvements over Android so I'll give them credit but holy hell is navigation just a complete mess. Every app seems to behave differently, and even within the same app you'll see inconsistencies.
Would it really be that hard to provide a universal back gesture that works across apps like Android has? It makes the phone so clunkly and slow.
I've always wanted to use Safari as my default browser. I just need them to fix the disappearing favicons in the sidebar tabs. Apple: please fix.
Hah, I just paid for an addon to do this, Noir. Sure you could do it for free but it's a nice experience. Oh well, no harm done.
• As a user: great
• As a web developer: what a nightmare, now your website will look different to different people, as if having to support multiple browser engines and multiple screen rations, and multiple platforms, etc. was not a big pile of problems already.
• As someone who doesn’t like dark-mode due to eye strain: good-good… for people who like it ¯\_(ツ)_/¯
Re: web developer
> The HTML <meta name="color-scheme" content="light only"> tag lets browsers know that 1) this page supports light mode and 2) should only be displayed in light mode.
Even as a developer I'm all for it, go even harder. We may eventually reach the promised land where the user agent defines so much of the final appearance things like "pixel perfect design" or beating standard controls into within an inch of their lives to fit some design system are a thing of the past.
I like to think of it as a gentle encouragement to finally implement prefers-color-scheme in web applications.
(I say this as a designer who has spent countless hours on dark-mode palettes as well as someone who has the automatic circadian toggle enabled everywhere.)
disagree. the web specifically is built as a dynamic medium for consumption. The fluid nature is the point. Yes, it is harder for developers to force a consistent experience, but as a professional web dev, we should not treat the web as a fixed medium.
As long as a client needs to approve a layout, that is not happening
Sounds like a problem with the client.
A web agency is not going to start questioning the brand book of a 100x larger client.
I'm not going to publically question my boss doing stupid shit, but that doesn't make him not stupid.
Wait until you learn I can change the font size and even override the site CSS on my own machine!
Who cares if you can? I am referring to non-tech-savvy web users who barely know what YouTube is: your parents, grandparents, accountant, or city firefighters. There are literally millions of people in this planet who don’t even know what HTML is. The commenters above appear to be criticizing my remark as if I was mistaken. Software developers often lack imagination when it comes to real-world problems.
> what a nightmare, now your website will look different to different people
That's what the web has always been. People don't all have the same display types, the same subpixel layouts, the same display sizes, the same DPIs, the same fonts, the same zoom levels... People use reader modes, global restyling extensions, per-site custom style sheets, full screen magnifiers, bounded/partial magnifiers, screen readers, OS high-contrast modes... the web has never been a fixed canvas that you get to paint on and then hand to users.
As a web developer, all you have to do is support `:prefers-color-scheme`.
Does this also allow me to lighten sites that default to extremely hard to read dark mode?
I wish the crusade to make everything dark would end.
So do others. https://xkcd.com/3227/
> Safari prevents websites from detecting when Adaptive Dark Mode has been applied. JavaScript that queries CSS colors will get the original authored colors, not the transformed ones. Any images drawn into canvas render in their original form.
So… the browser is now intentionally lying now. Ain’t that great.
> So… the browser is now intentionally lying now. Ain’t that great.
To the server. I'm 100% behind this. The unholy amount of control websites have over our web browser should go down, not up.
> To the server. I'm 100% behind this. The unholy amount of control websites have over our web browser should go down, not up.
Especially when so many lack reasonable ADA compliance.
This is more or less unavoidable to avoid breaking poorly-architected front-ends that rely on styling to handle logic.
One less thing to fingerprint.
Browsers already intentionally lie all the time, and have had to for years, because fingerprinting and tracking by various ad networks and bad actors has been rampant.
It's the user's agent
Browsers lie all the time. Browsers also prevent sites from getting the color of a link because visited links can be shown in a different color and this can be used by the site to tell if a user has ever visited a link.
Don’t you love it when browsers lie to websites to enhance the user’s privacy.
This is much better than the absolute embarrassment Mozilla tried with alternate page styles. I swear no one at Mozilla ever tested out the feature considering the style you select does not get persisted so the next time you navigate it reverts back to the original style.
Meanwhile this features is actually tired to a persisted device setting that doesn't get reset every time you go to a new page.
Do they plan to introduce compliance with PWAs any time this decade?
Thank you, whoever led this!
On the contrary, screw you whoever led it. Who even wants authored styles nowadays.
"Authored"? It just applies a set of rules to the existing stylesheet. It's not like they're customizing it for different websites.
It was a rhetorical question, hence no question mark.
take the wikipedia, no more flashbangs for me HA!
Wikipedia already supports dark mode as a feature of the default Vector 2022 skin.[0]
[0]: https://en.wikipedia.org/wiki/Wikipedia:Dark_mode
I guess this time suffering was really a choice :(
Wikipedia allows you to write any custom CSS. In 2012/2013 when Facebook IPO’ed and was the cool thing I made a user CSS that made Wikipedia look like Facebook.
damn
"Websites aren't making dark mode versions! WE'LL DO IT FOR THEM!"
This has to be the result of some passion project by yet another whacko dark mode fanatic (you know who you are). Non-standard, assuredly buggy, and basically a maintenance nightmare. Good luck with that craziness.
Can we have another setting which turns dark websites into actually readable light designs for adults?
Is this a headline form the year 2015?
For anyone using Zen browser, you can accomplish this on a site by site basis using the newer "Boosts" feature available via the extensions button in the url bar
Personally, I find it close to perfect for Gmail and HN, among others
This is surely going to be optional, so it won't impact me in the slightest, but it is a pet peeve of mine when browsers (or browser extensions, looking at you 1Password) alter the UI of websites away from how they were originally designed without explicit instruction to do so.
This sounds like it meets that threshold, it will just surely be a hit-or-miss mess. Hopefully if it makes it to iOS it will drive more site owners to adapt to `prefers-color-scheme`.
Browsers are user-agents, not website-agents. By way of example, if a website shows ads or does tracking, I will absolutely alter it to my liking.
I and my browser are allowed to do whatever I want with the data that is posted on the public internet.
I'm very in favor of users being able to do whatever they want with websites - I'm all for it. I just don't like extensions making changes without a clean way to disable it, like in 1P