Background Colors

Allows you to add a background and/or overlay colour to the background.

Background Colour

The Background Colour property defines the colour of the background of the block.

You can choose a colour in the colour picker, a Global Colour or a Colour Gradient which can be linear or radial.

Add a Background Colour

For blocks with background capabilities:

  • Select a block.

  • Open the Block Inspector.

  • Navigate to the Primary Tab.

  • Find the Background property.

  • Open the colour picker by clicking on the colour circle.

  • Select required colour (colour picker, global colour, gradient (linear or radial)).

To modify any block's background colour:

  • Select a block.

  • Open the Block Inspector.

  • Navigate to the Design Tab.

  • Open the Background Tab.

  • Open the Colours Tab.

  • Find the Overlay property.

  • Open the colour picker by clicking on the colour circle.

  • Select a colour (colour picker, global colour, gradient (linear or radial)).

Reset Background Colour

For most blocks with background capabilities:

  • Select a block.

  • Open the Block Inspector.

  • Navigate to the Primary Tab.

  • Find the Background property.

  • Click dot to reset.

To reset any block's background colour:

  • Select a block.

  • Open the Block Inspector.

  • Navigate to the Design Tab.

  • Open the Background Tab.

  • Find the Background property.

  • Click dot to reset.

Overlay Colour

The Background Overlay property defines the colour of the overlay that covers the block.

Overlay works on all blocks except images.

Add an Overlay Colour

  • Select a block.

  • Open the Block Inspector.

  • Navigate to the Design tab.

  • Open the Background tab.

  • Open the Colour tab.

  • Find Overlay.

  • Open the colour picker by clicking on the colour circle.

  • Select a colour (colour picker, global colour, gradient (linear, radial or conical)).

Reset Overlay Colour

  • Select a block.

  • Open the Block Inspector.

  • Navigate to the Design Tab.

  • Open the Background Tab.

  • Open the Colours Tab.

  • Find the Overlay property.

  • Click dot to reset.

  • Without Overlay.

Last updated