Skip to main content

New Safari beta allows websites to adapt their theme to complement macOS Mojave in Dark Mode

The new Safari Technology Preview brings a much-needed feature to the Mac browser. macOS Mojave introduced a new Dark Mode system appearance, which automatically applies to the dock, menu bar, system controls, and third-party apps can update to take full advantage of the new dark theme interface. However, it is currently not possible for websites to know if the user is using the dark appearance.

This is changing soon. The new Safari beta includes support for the ‘prefers-color-scheme’ CSS media query. This will allow websites to adapt automatically to changes in system appearance. So when you are using Mojave in Dark Mode, (updated) websites can automatically use dark themes too.

Apple releases Safari Technology Preview versions every two weeks. The Dark Mode support is included in the version released today, Safari Technology Preview 68.

Safari Technology Preview acts as a testing ground for upcoming Safari features. Web developers (or anyone) can install it alongside ‘normal’ Safari and use both interchangeably.

One of the big annoyances with Dark Mode in macOS Mojave currently is that most content is bright white and clashes with the subdued blacks and greys of native apps in Dark Mode. The new CSS media query gives websites the opportunity to adapt their styling for light and dark OS appearances.

Obviously, this feature is not automatic and requires adoption on a per-website basis, and uptake will probably be slow given the relatively low market share of Safari running on macOS Mojave. Nevertheless, at least it is now possible where it simply wasn’t before.

Once changes are tested and finalized, they are rolled out to all users in software updates, usually tied to OS releases. The addition of ‘prefers-color-scheme’ today means the feature is unlikely to be deployed with macOS Mojave 10.14.1 (which is currently in beta 5). Although timing is unconfirmed, expect to see this support roll out in a Safari release in early 2019.


Check out 9to5Mac on YouTube for more Apple news:

FTC: We use income earning auto affiliate links. More.

You’re reading 9to5Mac — experts who break news about Apple and its surrounding ecosystem, day after day. Be sure to check out our homepage for all the latest news, and follow 9to5Mac on Twitter, Facebook, and LinkedIn to stay in the loop. Don’t know where to start? Check out our exclusive stories, reviews, how-tos, and subscribe to our YouTube channel

Comments

Author

Avatar for Benjamin Mayo Benjamin Mayo

Benjamin develops iOS apps professionally and covers Apple news and rumors for 9to5Mac. Listen to Benjamin, every week, on the Happy Hour podcast. Check out his personal blog. Message Benjamin over email or Twitter.


Manage push notifications

notification icon
We would like to show you notifications for the latest news and updates.
notification icon
Please wait...processing
notification icon
We would like to show you notifications for the latest news and updates.
notification icon
Please wait...processing