Library · Heroes & Page Banners

Hero / Standard

Full-width hero band — photo under a dark scrim, small-caps subheading (H6) above the page H1, aligned bottom-left on the content grid. Text is literal white by design (sits on the photo, not a themed surface).

Figma: Hero / Standard | Sub heading small above ↗ View Elementor template in 8020 ↗

Live preview — edit theme bottom-right

---
import HeroStandard from "../components/figma/HeroStandard.astro";
---
<HeroStandard
  image="https://images.unsplash.com/photo-1600585154340-be6161a56a0c?w=1600&q=60"
  imageAlt="Open-plan kitchen in a contemporary home"
  eyebrow="Brisbane Real estate"
  title="Welcome to Company XYZ"
/>

Props

Name	Type	Required	Description
`image`	`string`	Yes	Background image URL
`imageAlt`	`string`	—	Alt text — leave empty for a purely decorative backdrop
`eyebrow`	`string`	—	Small-caps line above the title (H6 text style)
`title`	`string`	Yes	The page H1

Example with all props

<HeroStandard
  image="/images/hero.jpg"
  imageAlt="Open-plan kitchen at dusk"
  eyebrow="Brisbane Real estate"
  title="Welcome to Company XYZ"
/>