Parallax background hero example

Build a stunning website that attracts visitors

Get started
Hero style

This is the Hero block

Turn Parallax background on and the image scrolls slower than the page behind it. Works with any background colour.

Drop it in

Edit any page with Elementor and look for "Assan Hero" in the Assan Hero group of the widget panel. Drag it to the top of the page.

Then set it

Everything you can see above is a control in the panel - the background, the height, the button hover, the shape divider. No two of these pages use a different block for the same look.

Over the header

This page sets its header to Transparent in the Assan Layout box so the bar paints over the hero. Ported from hero-parallax.html.

See the rest of the set

Every hero in the kit is one of four blocks with different settings. Pick the one closest to what you want and change it from there.