Hero
Each example below is a real component instance — flip the theme toggle to see how it adapts.
Default#
Loading…
Props#
| Prop | Type | Default | Description |
|---|---|---|---|
| eyebrow | ReactNode | — | Eyebrow / pill rendered above the headline. |
| title * | ReactNode | — | Headline. Pass JSX to highlight a phrase (e.g., `<span className="text-accent">…</span>`). |
| description | ReactNode | — | Subheading. |
| actions | ReactNode | — | Action buttons row. |
| visual | ReactNode | — | Trailing visual (right-side image, animation). When provided, the hero switches to a two-column layout. |