Layout
Hero Section
layoutlanding pageabove the foldCTA
Top section with headline, supporting text, and primary action.
When to use
- Opening a landing or marketing page
- Communicating a product's core value proposition immediately
- Directing users toward a single primary CTA
Examples
- Stripe's homepage with a bold headline and 'Start now' button
- Linear's hero with animated product screenshot behind the headline
See this in the wild
Analyze a site and look for hero section in the breakdown.
