Hero
v1.0.11Updated 27 Aug 2026Above-the-fold hero section for landing/marketing pages — headline, subcopy, CTAs and a visual. Copy-paste block; baked-in demo content (no data props — edit the JSX to customise).
Preview
Live · 13 storiesSplit ImageOpen ↗
▸Why this is recommendedherolandingmarketingheader+4
Hero in a two-column split layout — image.
Recommended for+14
- ✓Landing pages
- ✓Marketing/product home pages
- ✓Campaign pages
Tags+6
herolandingmarketingheaderabove-the-foldsectionsplitimage
Features+4
- Headline + subcopy + primary/secondary CTA
- Split-image, centered-gradient, orbit, app-screenshot, form and video-bg layouts
- Self-contained — no required props
Not recommended for−2
- ✕In-app dashboards
- ✕Dense data screens
Install
Ask your agent, or call the MCP tool directly. The resolved bundle is written into your project.
Usage
Tick variants in the left menu — each adds a tab with that variant’s real story source, the same code the preview above renders.
Props
PropTypeRequired
classNameOptional wrapper class override
—