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.
Try Amazon Prime 30-Day Free Trial
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.