L-164Layout

Velvet Hero Section

Full-width landing hero built as a plain, fully editable Etch tree: section (backdrop layer + scrim) > container > panel (eyebrow, two-line H1, subtext, primary/secondary CTAs) and, in split layout, a framed visual card.…

Get this with ProIncluded in your plan

50 sites for €79 only, Compare all plans

Preview Desktop, 1280px

All photos and visual assets used in this preview are sourced from Unsplash.

The system behind it

One pattern, your whole brand.

Velvet Hero Section reads your ACSS tokens, so changing a color, a font or a spacing value once restyles it everywhere. No hard-coded values, nothing to override.

Type: Layout
Category: Hero
Responsive: Desktop to phone
Works with: Etch, ACSS, plain CSS

Options 5

Set on the section, in Etch’s attributes panel. No code needed.

data-background

imagevideogradientmeshparticles

background treatment: a photograph, a looping muted video, an animated two-tone gradient sweep, a drifting 3-blob gradient mesh, or a canvas dot field that drifts slowly

data-layout

centeredsplitfull-bleed

centred stacked copy over the backdrop, a two-column split with a framed visual, or an edge-to-edge full-viewport treatment

data-entrance

risefadereveal

entrance style: rise (fade + translate up, staggered), fade (opacity only), reveal (a clip-path wipe), each staggered across eyebrow/heading/subtext/actions

data-entrance-speed

slownormalfast

entrance + stagger timing

data-parallax

truefalse

toggle: backdrop drifts and the copy panel fades/shifts as the hero leaves the viewport on scroll

Included in Pro From €39 a year, with all 753 patterns.

Get Pro

Or start with the free packs

More patterns