Full screen hero example with background

Build a stunning website that attracts visitors

Get started
Hero style

This is the Hero block

The same hero set to fill the viewport, so the first thing a visitor sees is only this. Height is a control, not a separate block.

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-fullscreen.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.