Split Hero with Product Panel
Copy on the left, a drawn product panel on the right — the default hero for anything with an interface to show, with no image asset to host and no layout shift while it loads.
Centred, split, screenshot-led and waitlist variants.
The hero is one sentence and one action, and everything else on it is negotiable. Centred works when you have no product shot yet; split works when you do; the screenshot variants exist because a picture of the actual interface outsells any amount of adjective. All of them keep the headline as real text so it can be your largest contentful paint rather than an image.
Copy on the left, a drawn product panel on the right — the default hero for anything with an interface to show, with no image asset to host and no layout shift while it loads.
A linked announcement pill over a large centered headline, dual CTAs and a wordmark strip — the hero for a product with nothing to screenshot yet.
A drawn terminal whose install line is real, selectable text with a working copy button and a feature-detected clipboard call — the hero for anything adopted by typing rather than signing up.
Centered copy above a screenshot in window chrome, masked at the bottom so a tall image never dictates the height of the fold. Wraps your own img or video.
A pre-launch hero whose only ask is an email address, with pending and success states and a signup count that argues for finishing rather than starting.
A hero whose primary action is a real search form with prefilling suggestion chips — for marketplaces and directories, where sending the visitor below the fold to find the search box is the whole failure.
A drawn phone beside two store links built as real anchors rather than badge images, so they inherit the theme, need no hosted asset and carry an accessible name that is not a filename.
Pitch on the left, a marked-up figure and blockquote on the right, so the claim and the evidence for it share the fold instead of sitting a scroll apart.
A centered hero closing on a definition list of scale numbers, with a masked grid wash behind it — for infrastructure and payments, where "how many" is the second question a buyer asks.
A serif display headline over a 60-character standfirst and a real byline, with one text link and no competing CTAs — the hero for publications and essays, where the writing is the product.
Copy over your own image or video, with a graded scrim and deliberately fixed light-on-dark text — because the background is a photograph in both themes, so flipping the copy would break it.
A hero whose visual is the connector list itself, marked up as a real list so a visitor can skim it for their own stack — asset-free initials tiles, no third-party marks to license.
A day strip built as a radio group rather than buttons, so arrow keys move between dates and sold-out days disable properly — the fold for anything sold by the appointment.
Names the price above the fold for single-plan and one-time products, with the former price in a real strikethrough element so it is never announced as the current one.
Closing bands, inline prompts, newsletter and waitlist captures.
Whole marketing pages, assembled and ready to clone.
Gradients, waves, particles and meshes that move without JavaScript.
Accordions, two-column lists and category-grouped questions.
Quote walls, single-feature quotes, logo-plus-quote rows.
Mega footers, minimal bars, newsletter and sitemap columns.