Hero Sections

Available Options:

  • aspect_ratio: 16:9, 4:3, 21:9, 1:1, auto, fullscreen
  • media_type: image, video

Scroll down to see each variation.

Hero - 16:9 Aspect Ratio

Hero - 16:9 Aspect Ratio

aspect_ratio: 16:9 | media_type: image

Scroll

16:9 - Standard Widescreen

The classic widescreen format. Good for landscape images and video content.

Hero - 4:3 Aspect Ratio

Hero - 4:3 Aspect Ratio

aspect_ratio: 4:3 | media_type: image

Scroll

4:3 - Classic Format

Traditional aspect ratio. More vertical space, good for portrait-oriented subjects.

Hero - 21:9 Ultrawide

Hero - 21:9 Ultrawide

aspect_ratio: 21:9 | media_type: image

Scroll

21:9 - Cinematic Ultrawide

Cinematic format. Creates dramatic, panoramic effect. Less vertical impact.

Hero - 1:1 Square

Hero - 1:1 Square

aspect_ratio: 1:1 | media_type: image

Scroll

1:1 - Square Format

Square aspect ratio. Unusual for heroes but can work for specific designs.

Hero - Auto Height

Hero - Auto Height

aspect_ratio: auto | media_type: image

Scroll

Auto - Natural Image Height

Uses the natural aspect ratio of the image. Height varies based on image.

Hero - Fullscreen

Hero - Fullscreen

aspect_ratio: fullscreen | media_type: image

Scroll

Fullscreen - 100vh

Full viewport height. Most dramatic option. Text overlay centered.

Next: Content Blocks

Explore all content block layout variations