As an Amazon Associate, I earn from qualifying purchases.
  1. Home
  2. Snippets

Apply Transparency Grid on Page Background

Staff // (Updated: )

This Chrome Snippet applies a transparency grid on body background of any page, so you can easily check image transparencies or any background issues on the page.

Here is the snippet: = ""; = "linear-gradient(45deg, #f0f0f0 25%, transparent 25%), linear-gradient(-45deg, #f0f0f0 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #f0f0f0 75%), linear-gradient(-45deg, transparent 75%, #f0f0f0 75%)"; = "20px 20px"; = "0 0, 0 10px, 10px -10px, -10px 0px";

How To Use

  1. To open up Chrome Developer Tools (DevTools) press F12 on any web page.
  2. On the Sources tab, select Snippets on the left-hand panel.

  1. Click on + New Snippet button and paste the code in the editor. Then press CTRL+S to save the code.
  2. To run the snippet, right click on the snippet and select Run.

I hope you enjoyed this tip. Follow me on twitter for more tips like this! Enjoy!

Leave a Reply

Your email address will not be published.

This site uses Akismet to reduce spam. Learn how your comment data is processed.

More Snippets
Share Share Tweet