How to: Read web content 'dark' in the Edge browser

Published by at

Following my musings on a dark reading mode in Edge on Android, I suspect the title here would be a FAQ if indeed enough people knew it was possible in order to ask how to enable it! After writing a few million words on AAWP over the last five years even I didn't know about (or remember) this feature, so I thought a 'how to' tutorial was in order.

The issue, of course, is that web pages are almost always white in terms of background. So glaring on the eyes if you bring them up in the evening and very battery-unfriendly on any phone with an AMOLED screen (which most of the top Windows phones use). 

However...

There's a way to read the exact same web content in full-on dark mode, with text content appearing as white on black (and with images appearing as normal - you wouldn't want these inverted, etc, would you?) It's not as simple as the whole web browser going dark - unfortunately, but it's not difficult either:

1. In a web page, tap on the Reading Mode control

You'll find this control bottom right in the UI, next to the '...' menu. It looks like an opened book. Tap on it. The page will reload completely, but this time in a specially formatted way with all extraneous web content left behind. You should get just the main text and any core images. By default, this Reading Mode comes up with a white background, just like the web itself - or a cream background if you're lucky.

Screenshot, Edge tutorialScreenshot, Edge tutorial

So we're on a typical web page and it's all too bright. Tap on the Reading Mode control, bottom right, and it turns blue, reloading the page with everything stripped down and reformatted, as shown on the right.

2. Find the font and theme control

Next, look at the top right of the UI. In the solid bar at the top of Reading Mode, right in the corner, should be a familiar (but very small!) 'font size' control (two letter 'A's). If you can't see it then this is because the control is the same colour as the title bar (an Edge quirk), but don't worry, the control IS there. Just tap in the top right corner and you'll see a font and theme pane drop down.

Screenshot, Edge tutorialScreenshot, Edge tutorial

Here I've switched from the Trump article to something more palatable! Tap on the top right font control and it pops open with an extra row of 'themes'. By default it'll probably be one of the first two (above, left), but you should tap on the third, turning Reading Mode totally 'dark' (above, right).

3. Pick a Page Theme

Under 'Page theme', tap on the third option, showing white text on a dark background. The background of the underlying Reading Mode content should change immediately and you can then browse content without undue eyestrain or power drain. Tap outside the theme pane to dismiss it.

To exit Reading Mode, either use the 'back' control or tap the 'Reading Mode control icon, bottom right, to toggle it off again.

Screenshot, Edge tutorialScreenshot, Edge tutorial

In recap, the difference this all makes. On the left an original white-backed web page, with fairly small (but standard) text, on the right the dark-themed Reading Mode. Note also the extra effort put in by Edge to enhance Reading Mode with a larger range of fonts. Anything to reduce eye-strain!

In theory, Edge should now remember your preference for Reading Mode on any other web page and now you know how to re-render pages in this jet black way whenever you need to.