A transparent overlay is a layer of hue used to change the color of an image. Applying the overlay is one of the quickest ways to make a beautiful cover for a landing page or portfolio without uploading a new background image.
Adding a block background overlay
Sitebuilder allows you to add a single color overlay to your background to tone down its color and make your buttons and texts stand out.
Here’s how you can add an overlay:
- Hover over the block where you want to add an overlay to enable its Control pane.
- Click the Edit image icon, which is a shortcut to the Appearance tab.
Alternatively, you can click Block settings > Appearance tab.
- Scroll down to Background settings and tick the Add overlay checkbox.
- The smart interface will automatically set the recommended overlay’s opacity for your background image. If you want to change it, customize it by moving the slider.
- Click Save to apply the changes.
Remember to publish your website to make the changes live.
If you want to highlight your background, you can add an animated one. Learn more about it from our dedicated tutorial.