The Hero Section

The first thing anyone sees

Eyebrow, heading, text, and button -- what each field in a Hero section does and how to write one that actually works.
Pages & Design 2 min read Updated September 2026

The four fields

A Hero has four parts, and you do not need all of them:

  • Eyebrow -- a short label above the headline, like "From the founder" or "New this season." Optional, and easy to skip.
  • Heading -- the actual headline. This should be the one sentence you would say if someone only read one thing on your whole site.
  • Text -- a short paragraph underneath, giving one more beat of context. Keep it to two or three sentences; a Hero is not the place for a long story.
  • Button -- an optional call to action. Only appears if you fill in both a button label and a link -- leave either blank and no button shows.

Alignment and background

You can align a Hero left or centered, and choose its background treatment from the site's design settings. There is no wrong choice -- centered tends to feel calmer and more like a statement; left-aligned feels more like the start of a conversation. Try both on your actual headline before deciding; they read differently with real words in them than they do empty.

Writing a heading that works

Avoid a Hero heading that only says what you are ("Welcome to Sunrise Yoga Studio") -- a visitor already knows that from your site name. Say what changes for them instead: what they get, what problem goes away, what they walk out with. "Build your shop's website. Keep running your shop." tells someone something a name alone never could.