Add a Transparent Background Colour to Text and Buttons

What does this code do?

This code snippet will allow you to add a semi-transparent background colour to text and buttons in Squarespace. This allows your background image to show through while making sure your text is nice and clear.

Video Tutorial

Code Snippets

Copy and paste this code into Design > Custom CSS

/* Background on Text */
#BLOCKID {
  background: rgba(0,0,0,0.6);
  padding-top: 1vw;
}

/* Background on Button */
#BLOCKID {
  background: rgba(0,0,0,0.6);
  padding-bottom: 1vw;
}

How To Use It

1. Copy and paste the code as indicated above.

2. Customize the background colour and spacing.

3. To learn how to find a block id check out our Start Here guide.