How to add inner shadows to your page blocks

Pages is available on the following plans:

  • Plus
  • Professional
  • Enterprise 

Each of your page blocks can be edited to fit your needs. Add inner shadows to give your page's blocks depth.

Adding inner shadows to page blocks

To add an inner shadow you must first select a block by clicking it. Once selected, the block's details will occupy the right pane. From this pane, you can add an inner shadow. Newly added blocks do not have inner shadows; however, there is no limit to the number one can have.

Click the grey "+" to add an inner shadow or the red "x" to remove one.

Inner shadows stack in the order you add them. Change the stacking order by dragging an inner shadow, by its left handle, up or down, then release at the desired position.

Editing inner shadows in blocks

You can configure inner shadows. When you add an inner shadow its color is set to the first color in your theme's palette. The input fields on the right changes the offset, blur, and spread. Clicking the circle on the left accessing color, tint, shade, and opacity.

Clicking on an inner shadow's left circle accesses the following:

  • Pick another color
  • Adjust gradient
  • Adjust opacity

You can also change the direction of the inner shadow by dragging the caret around the inner shadow's left circle.

There are three input fields for each inner shadow:

1. Offset
Increasing the offset will expand the shadow in the direction of the caret on the circular color widget.

2. Blur
Increasing the blur will make the shadow bigger and lighter.

3. Spread
Increasing the spread will expand the entire shadow.

Have more questions? Submit a request