What is a Hero Section?

A hero section is a prominent area at the top of a page that communicates the primary message and action.

When to use Hero Sections?

- Landing pages and marketing surfaces

When not to overuse Hero Sections?

- Utility pages where content discovery should start immediately

What is the anatomy of Hero Sections?

- Headline, supporting copy, primary CTA

- Media: image, video, or illustration

- Background, overlays, and responsive cropping