Search
One index across every family, plus the documentation. Press ⌘K anywhere for the command palette.
26 results for “hero”
Sections
10- Hero with announcement stripMarketing
A tinted announcement bar above a compact hero, in DOM order as well as visual order.
- Hero with statistics bandMarketing
A claim above a four-figure band, with every figure read from the live catalogue.
- Code-sample heroMarketing
A developer hero pairing the pitch with a real, valid code sample in a window frame.
- Editorial split heroMarketing
An asymmetric seven-and-four column hero where the statement and the note sit at different weights.
- Inverted pattern heroMarketing
A dark hero with a drawn grid and a radial mask instead of a gradient.
- Media-frame heroMarketing
A 16:9 media slot whose aspect ratio is reserved before anything loads.
- Product mosaic heroMarketing
Three offset panels built from live components rather than a screenshot.
- Testimonial-led heroMarketing
A hero where the customer quote is the headline.
- Two-audience heroMarketing
A fork in the road for products with two genuinely different buyers.
- Waitlist heroMarketing
A hero whose only job is one email address, with validation and inline social proof.
Navigation
11- Agency heroHeaders
A statement of practice, a capability list, and the client roster immediately below.
- Ecommerce heroHeaders
A seasonal statement over an inverted field, with the category rail directly beneath.
- Editorial heroHeaders
A title page: rule, eyebrow, oversized serif statement, standfirst at the reading measure.
- Enterprise heroHeaders
Two equal-weight actions and an assurance panel carrying compliance facts.
- Portfolio heroHeaders
Name, practice, location and availability — with availability as a Status, not a badge.
- Product launch heroHeaders
Version chip, product name, one-line promise, one action, and a three-figure fact strip.
- SaaS heroHeaders
Announcement pill, centred headline, paired actions and a three-item objection-handling row.
- Search-led heroHeaders
A large search field with seeded suggestions and live, announced results.
- Split hero with live panelHeaders
Copy on the left, a real component composition on the right — not a screenshot.
- Startup heroHeaders
A direct claim, one action, and social proof built from faces rather than logos.
- Transparent over heroNavbars
A navbar with no background of its own, inheriting inverted ink from the hero beneath it.
Patterns
5- Agency landing pageBusiness
Work first, then process, then people — with the contact block folded into the footer.
- Corporate pageBusiness
Written for an evaluator and a procurement reviewer at the same time.
- Ecommerce landing pageCommerce
Product first, with everything above the grid existing only to reach it faster.
- Product launch pageLanding
A single moment, with what shipped before what is next and an interactive preview in the middle.
- SaaS landing pageLanding
Eleven blocks in the order a subscription product needs: claim, proof, mechanism, evidence, price, objections, action.