How to forcibly enable Dark Mode on every website with Google Chrome

0
91

Google Chrome 78 introduced a new feature called Forced Dark Mode that forcibly enables a dark theme for any website, regardless if the website supports one or not.

This “dark mode” refers to a website’s content, and should not be confused with the operating system’s dark mode, or the browser’s UI dark mode. Those dark modes refer to the color of the OS and the browser’s user interface elements, and not to a website’s color scheme.

For example, a website like ZDNet does not natively support a dark mode. By default, our website has a light theme, showing black text on a white background, like most other news sites.

However, with Forced Dark Mode, anyone can enable a dark theme for the ZDNet (or any other) website, showing white text on a dark background. For the image below, we purposely left the OS and Chrome in a light theme, but put the ZDNet website in a forced dark mode, via Chrome.

chrome-forced-dark-mode-1.png

To enable Forced Dark Mode in Chrome 78 and later, users must enable a Chrome flag — a special browser setting that enables a hidden feature.

All Chrome flags are accessible at the chrome://flags address. The official name for this feature is “Force Dark Mode for Web Contents” and its shortcut is:

chrome://flags/#enable-force-dark

chrome-forced-dark-mode-flag.png

Image: ZDNet

Several options are available in the dropdown menu accompanying this Chrome flag; however, they all work the same, with slight variations, so there’s no need to panic or feel overwhelmed.

Under the hood, Forced Dark Mode uses color theory to inverse the color to its exact opposite (white to black, and vice-versa).

There are several color models through which the opposite colors can be computed, and the options available in the dropdown reflect the different ways through which Chrome will reverse colors.

They all do the same thing, and the result is mostly the same. In the end, it’s just a matter of personal taste of what “Forced Dark Mode” looks more appealing to each one of us.

Users will need to test each one and see which is to their liking. You can’t go wrong with CIELAB, if you need a quick recommendation.

‘Made by Google’

Pixel 4 and Pixel 4 XL: Where to find the best deals

New Google devices: Prices, release dates, and where to buy

Pixel 4: Too weak, late, and expensive

Pixel 4: Release date, specs, features

Google’s new improved camera comes with a great phone, too

Pixel 4, Pixelbook Go, Nest: More about software, ambient system strategy than hardware

Google’s new Pixel Buds are designed to take on the wireless earbud competition

Pixelbook Go: Google gives enterprise up to competitors to focus on the masses

Pixel 4 storage fail (ZDNet YouTube)

Google Pixel 4 event 2019: Everything Google announced (CNET)

Google Pixel 4 features that business users will need (TechRepublic)

Related Topics:

Innovation

Cloud

Mobility

Enterprise Software

Artificial Intelligence

Hardware