In the next official update to macOS Mojave, Apple's Safari browser will enable automatic Dark Mode for websites that support it.

safari dark mode for websites
Since the release of Safari Technology Preview 68 in October, Apple has been building support for the use of ‌Dark Mode‌ CSS, which can be enabled via its Develop -> Experimental Features menu. The experimental feature has now also made its way into the latest macOS Mojave 10.14.4 developer beta.

macOS Mojave enables users to switch between Light and Dark mode via System Preferences -> General. With the latest macOS developer beta installed, websites that support the new CSS query will automatically adapt their color scheme to match whichever system-wide option the user has enabled.

dark mode safari website
As noted by iDownloadblog, developers running the macOS 10.4.4 beta can test out the new feature by visiting software engineer Kevin Chen's website, which already supports the new Safari CSS media query. Everyone else can give it a spin by downloading the latest version of Safari Technology Preview, which can be run alongside vanilla Safari in any version of macOS Mojave.

Related Forum: macOS Mojave

Top Rated Comments

nortonandreev Avatar
39 months ago
While this is neat, I can’t see it being widely implemented by websites.

I’m a web dev and I feel like unless this becomes a standard across all browsers, we simply won’t implement designs for it. It’s a further cost to our clients (and a pretty major one in reality) and for a single web browser? A web browser that only runs on a single OS? I doubt many companies will be keen to spend money on this.
Others browsers will implement support for it as well, eventually. Also, Windows 10 has already got dark theme, so it makes sense for other browsers to have it as well. Chrome and Firefox are already working on it. When it comes to adding support for it and the costs related to it, I think it mostly depends on how big the website is, but for my personal website I added the query for like 5 minutes. I think it is really nice feature and hope to become widespread in near future. Just because you feel like it's "useless", doesn't mean it's the case for everyone else.
Score: 4 Votes (Like | Disagree)
Fuchal Avatar
39 months ago
Others browsers will implement support for it as well, eventually. Also, Windows 10 has already got dark theme, so it makes sense for other browsers to have it as well. Chrome and Firefox are already working on it. When it comes to adding support for it and the costs related to it, I think it mostly depends on how big the website is, but for my personal website I added the query for like 5 minutes. I think it is really nice feature and hope to become widespread in near future. Just because you feel like it's "useless", doesn't mean it's the case for everyone else.
And if your website already has a dark mode, it's just a matter of automatically choosing it as the default.
Score: 4 Votes (Like | Disagree)
twistedpixel8 Avatar
39 months ago
Others browsers will implement support for it as well, eventually. Also, Windows 10 has already got dark theme, so it makes sense for other browsers to have it as well. Chrome and Firefox are already working on it. When it comes to adding support for it and the costs related to it, I think it mostly depends on how big the website is, but for my personal website I added the query for like 5 minutes. I think it is really nice feature and hope to become widespread in near future. Just because you feel like it's "useless", doesn't mean it's the case for everyone else.
I don't remember calling it "useless". My point was that it's an additional burden on Web Devs and that translates directly into cost which has to be eaten by someone. And I sure as heck am not eating it.

Respectfully, if you're happy with implementing Dark Mode as an afterthought, the 5 minute approach will probably suffice. If, however, you do things properly, you need to consider the aesthetics/UX of the site as a whole and make all the same considerations you would when designing the default aesthetics/UX.

Maybe if the site is extremely basic with 95% of it black text on white background, you'd get away with it. The issue is that if users start to expect all sites to work with Dark Mode, you create a huge problem.
Score: 4 Votes (Like | Disagree)
Kangastu Avatar
39 months ago
I think the Mac / iOS specialist sites (MacRumors / 9to5mac etc) and third party manufacturers that specialise in Apple stuff (twelve south, etc) may do this, but as a web dev myself I second twistedpixel8’s comments - unless it becomes a global “dark mode” standard, uptake of this is going to be slow to non existent.

Love the idea and the direction.

Side note: I hope this points to iOS13 having a dark mode!
Score: 3 Votes (Like | Disagree)
zeekyr Avatar
39 months ago
I've been looking for something like this to go with dark mode on my 2017 MBP running Mojave. Is this something that the end user can do right now? If so, can you link a tutorial? I used to do web development myself, so I'm comfortable with CSS.
I'm using these two addons to achieve this affect:

https://darkreader.org

No CSS editing is needed for that one.

https://cascadea.app

This one lets you customize the CSS of any website further. For example, I used this addon to invert the NYT logo, because Dark Reader didn't automatically do that. It lets you tweak and customize things even more.
Score: 2 Votes (Like | Disagree)
Pakaku Avatar
39 months ago
There are websites out there that already offer a dark theme you can switch on or off. I doubt it would be that difficult to automate that switch if the theme is in place already, and I wonder if the complainers here really should be ignoring a feature many people would find useful.
Score: 2 Votes (Like | Disagree)

Popular Stories

iPhone 14 Mock pill and hole thumb

ProMotion Now Expected to Remain Exclusive to iPhone 14 Pro Models, Not Expand to Entire Lineup

Sunday January 16, 2022 8:56 am PST by
Continuing the tradition set with the iPhone 13 Pro, only the highest-end iPhone 14 models will feature Apple's ProMotion display technology, according to a respected display analyst. Ross Young, who on multiple occasions has detailed accurate information about Apple's future products, said in a tweet that ProMotion will not be expanded to the entire iPhone 14 lineup and will remain...
AirPods Pro Gen 3 Mock Feature Red

AirPods Pro 2 Could Start a New Accessory Ecosystem

Friday January 14, 2022 2:34 am PST by
Apple's second-generation AirPods Pro could arrive alongside a new series of accessories, recent leaked images suggest. Alleged leaked photos of the next-generation AirPods Pro obtained by MacRumors showed a charging case with a metal loop on the side for attaching a strap. Apple has not used this design for any of its other AirPod models and it is unclear why it would be added in this...
Unlikely Products 2022 Feature

Six Rumored Apple Products You're Unlikely to See This Year

Saturday January 15, 2022 2:06 pm PST by
Much has been said about what consumers could see from Apple in 2022, but the company is also working on a handful of rumored products that aren't expected to be unveiled for at least another 12 months, and in some cases a lot longer. Of course, that's assuming they get released at all. Apple works on many potential products some of which ultimately never see the light of day. With that in...
safari icon blue banner

Safari Bug Allows Websites to Track Your Recent Browsing Activity in Real Time

Sunday January 16, 2022 3:37 pm PST by
A bug in WebKit's implementation of a JavaScript API called IndexedDB can reveal your recent browsing history and even your identity, according to a blog post shared on Friday by browser fingerprinting service FingerprintJS. In a nutshell, the bug allows any website that uses IndexedDB to access the names of IndexedDB databases generated by other websites during a user's browsing session....
ipad air 4 video

New iPad Air Rumored to Launch This Spring With A15 Chip, 5G, Center Stage Camera, and More

Saturday January 15, 2022 8:05 pm PST by
Apple is planning to release a fifth-generation iPad Air with similar features as the sixth-generation iPad mini, including an A15 Bionic chip, 12-megapixel Ultra Wide front camera with Center Stage support, 5G for cellular models, and Quad-LED True Tone flash, according to Japanese blog Mac Otakara. Citing reliables sources in China, the report claims that the new iPad Air could be...
netflix2

Netflix Again Raises Prices for All Plans, 4K Streaming Now $20 Per Month

Friday January 14, 2022 12:46 pm PST by
Netflix today updated the prices for its streaming plans, and all of its offerings are now more expensive. The Basic plan is now priced at $9.99 per month, the Standard plan is priced at $15.49 per month, and the Premium plan is priced at $19.99 per month. The Basic plan is $1 more expensive, up from $8.99 per month. This plan allows users to watch on just one screen at a time, and it limits ...
top stories 20220115

Top Stories: iPhone 14 Pro Rumors, iCloud Private Relay Controversy, iOS 15.2.1 Released, and More

Saturday January 15, 2022 6:00 am PST by
Hole-punch? Pill? Hole-punch and pill? Rumors about what the front camera system on the iPhone 14 Pro will look like are evolving rapidly, and it now appears we might be getting a novel but potentially controversial design later this year. Other major stories this week included some confusion and controversy about iCloud Private Relay being disabled for some T-Mobile customers, increasing...
iPhone 14 Mock pill and hole 16x9 120hz

Analyst: All iPhone 14 Models to Feature 120Hz Displays, 6GB of RAM, and More

Friday January 14, 2022 7:02 am PST by
Apple is rumored to announce four new iPhone 14 models in September, and ahead of time, analyst Jeff Pu has outlined his expectations for the devices. In a research note with Haitong International Securities, obtained by MacRumors, Pu claimed that all iPhone 14 models will feature ProMotion displays, compared to only Pro models currently. ProMotion enables a variable refresh rate up to 120Hz ...