Enabling Dark Mode On Any Website: A Step-By-Step Guide For iPhone

Like most other devices, the iPhone offers a system-wide dark mode option. Dark mode is easier on the eyes, particularly for those who spend long hours staring at their phone. The harsh white background can be changed to a dark gray or black, reducing the screen glare. While it can take some time to get used to, once you've enabled dark mode, it's hard to go back.

Some people prefer using dark mode when the sun goes down since the screen glare can be particularly harsh under artificial light. Others prefer having it on all the time. Apps like Instagram, Snapchat, Facebook, WhatsApp, and Twitter have a default dark mode. 

Additionally, when dark mode is enabled on the iPhone, browsers like Safari and Chrome display darkened UI elements. However, this effect doesn't apply to websites. If you want to force all websites to load in dark mode, there are a few workarounds to enable this.

Enable dark mode on Safari with Reader

If you use Safari on iPhone, the easiest way to enable dark mode on any website is by using Reader. This mode hides ads, navigation menus, and other elements, making websites easier to read. With Reader, you can choose the website's background color, with two light and two dark colors (gray and black) available. 

To enable Reader for all websites where it's available, follow these steps:

  1. Open the Settings app on your iPhone.

  2. Tap Safari.

  3. Scroll down to Settings For Websites.

  4. Tap Reader and enable the toggle next to All Websites.

Compatible websites will now be displayed in dark mode. Once you choose a preferred background color for Reader, all future websites opened in Reader will automatically open in that color unless you change it again. It's worth noting that not all websites work with Reader, and some only support the mode on specific web pages. Some elements of a web page and the layout might not always appear as intended. Apple also lets you enable Reader on individual pages if you only want it on a specific site.

  1. Open a website in Safari on your iPhone.

  2. In the address bar, tap the AA icon.

  3. Tap Show Reader.

  4. Tap AA again, and select one of the two dark mode color options. Tap AA once more to close.

To turn off Reader for a particular website, tap the AA button in the address bar and select Hide Reader.

Enable dark mode on Safari with the Night Eye extension

While Reader is conveniently built into Safari, it does change the look of websites and isn't ideal to use all the time. That's where the Night Eye app comes in. The Safari extension offers a three-month free trial for the Pro subscription, after which you must pay $8.99 annually to use it on up to three browsers. Alternatively, you can use it for free with the Lite mode, which restricts dark mode usage to five websites of your choice.

Given the extended trial period, it's worth checking out Night Eye before you buy it. Here's how to install it on Safari:

  1. Download the Night Eye app from the App Store.

  2. Open the app, tap Next, and then Start trial.

  3. Next, open the Settings app on your iPhone and tap Safari.

  4. Under General, tap Extensions.

  5. Tap Dark Mode – Night Eye.

  6. Turn on the toggle on the next page.

  7. Under Permissions, select Allow next to All Websites.

You can now tap the Extensions button in Safari, which looks like a puzzle piece. Tap Night Eye and select Dark. You can adjust more parameters from this menu, like brightness, contrast, saturation, and blue light. Tap the Settings icon to access additional options, such as making dark mode default or setting a schedule. Another great dark mode extension for Safari is Dark Reader. The app costs $4.99 annually but doesn't offer a free trial.

Enable dark mode on Google Chrome

iPhone users who prefer using Google Chrome as their default browser are out of luck when making all websites appear in dark mode. However, there is a way to do this on platforms like Mac, Windows, and Android. This involves force-applying a dark mode by enabling a Chrome flag, an experimental feature hidden unless enabled. 

While Chrome extensions work great on the desktop, they aren't supported on mobile. As a result, extensions like Night Eye and Dark Reader that work on Chrome for Mac and Windows aren't available on Chrome for iPhone and Android. The only option is to enable dark mode on the iPhone, which will cause certain UI elements in Google Chrome, like the address bar, buttons, and settings, to appear in dark mode. Here's how to turn on dark mode on iPhone:

  1. Open the Settings app on your iPhone.

  2. Tap Display & Brightness.

  3. Select Dark under Appearance.

Open Chrome to view it in dark mode. Websites will continue to open in their default mode unless they offer a dark mode themselves.