web-cheatcodes

Remove annoying overlays and page elements

Overlays are messages that cover the whole content when you get to a web site. Some are legally necessary (like cookie consent messages) but most are there to tell you that things aren’t free and you should subscribe to get to the content. Some overlays are especially annoying as they show up with a few seconds delay or when you started to interact with the document.

Here’s how to get rid of overlays using the browser developer tools. You can try it out yourself on the example page with overlay.

  1. Open Developer Tools by pressing F12.
  2. Use the Inspect Tool by clicking the pointer icon to pick an element of the page The Inspect tool button
  3. Move your mouse around the document until the colour overlay shows that the element covers the whole page
  4. Click your mouse and the element will get highlighted in the Elements tool.
  5. Press Delete to remove it

You can see it in action in this recording:

Screencast showing how to remove the overlay

This works with any element you don’t want to have on the page, for example when you want to create a screenshot and get rid of extra content. Or when you want to print a page but not the ads.

You can try this on the different modes demo page as shown in the following recording:

Removing an annoying ad using the Inspect Tool