Image Style

Allows you to style your Gallery images using a variety of options such as Overlay, Animation, Opacity, Blending Options, Padding, Radius, Borders, Border style.

Colors

The Overlay property adds a layer to the images in your gallery.

Background Colour adds a colour or gradient to your Image or gallery block.

Add background colour

Select the gallery block
Open the Block Inspector
Navigate to the Primary tab
Open the Image Style tab
Select Background Color or Gradient

Padding

The Padding property allows you to specify the space that separates the Gallery Image block from its border on all sides.

Padding is not to be confused with Margin. The first adds space inside the element, the other adds space outside it.

Add padding

Select a gallery block
Open the Block Inspector
Navigate to the Primary tab
Open Image Style tab
Navigate to Padding
Link or Unlink Padding to add space to one or all sides

Remove padding

Select a gallery block
Open the Block Inspector
Navigate to the Primary tab
Open Image Style tab
Navigate to Padding
Click dot to reset all linked or selected unlinked padding

Border

Adds chosen border styling to the gallery block's images.

Animations

The Animations property adds a pre-set animation to your gallery on hover to make your gallery more interesting. Included are Mist, Spring, Sunrise, Blurry.

Add animation

Select a gallery block
Open the Block Inspector
Navigate to the Primary tab
Open the Image Style tab
Select desired animation in the Animation panel

Remove animation

Select a gallery block
Open the Block Inspector
Navigate to the Primary tab
Open the Image Style tab
Select None in the Animation panel

Visual

The Opacity property lets you specify the amount of opacity or transparency to apply to your Image blocks.

Adjust opacity

Select a gallery block
Open the Block Inspector
Navigate to the Primary tab
Open the Image Style tab
Adjust Opacity in the Visual tab

Reset opacity

Select a gallery block
Open the Block Inspector
Navigate to the Primary tab
Open the Image Style tab
Click blue indicator button to reset Opacity

The Blend Modes property defines how the gallery or image block should blend with the background.

Modify blend mode

Select a gallery block
Open the Block Inspector
Navigate to the Primary tab
Open the Image Style tab
Select Blend Mode

Filters

The Filter property adds an effect to your Gallery Images. These include: Blur, Brightness, Contrast, Grayscale, Hue-Rotate, Invert, Saturate and Sepia.

Add filter

Select a gallery block
Open the Block Inspector
Navigate to the Primary tab
Open the Image Style tab
Navigate to the Filters tab
Modify selected Filter effect

Last updated 2 years ago