Hero library · video

Split with vertical video

hero.video-split: any design can use this hero. It suits the styles below; pairing it with another style makes the picker warn about a clash.

Rule: Copy in 1–6 with a 3–4 row chapter list (timestamp + title); a 9:16 vertical video in 8–11 with a small 'now playing' caption under it.
Slots: eyebrow, headline, subhead, items[3..4], cta, heroImage, caption
Grid: copy 1-6 · video 8-11 · caption 8-11
Notes: The chapter rows seek the video to their timestamp on click. Video muted, looping, playsinline with a poster; pause control on the frame. Reduced motion: poster + play button.

Use a vertical 9:16 video in columns 8–11 with the style's radius — like a phone reel.
List 3–4 chapters under the subhead: mono timestamp, title; clicking a row seeks the video.
Keep one primary CTA under the chapters.
Add a small muted 'Now playing' caption under the video.

Don't

Don't use a landscape video in this hero.
Don't add phone-frame mockup chrome around the video.
Don't autoplay with sound.

Phone width

Video first at 9:16 capped to 70svh height, then copy and chapters; hide the caption.

Try this hero in the picker llms.txt

Live, in 3 styles it suits

In Athletic Sport

hero.video-split · hero

Open alone, full size (desktop, tablet, phone; layout tree included)

Brand & product studio

We make complicated companies simple to choose

Northfold is a 14-person studio helping manufacturers, labs and B2B teams explain what they do — and look like they mean it.

Discovery sprint

Positioning workshop

Identity design

Start a project

● 0:42

Corvid Robotics — identity

Desktop

Brand & product studio

We make complicated companies simple to choose

Northfold is a 14-person studio helping manufacturers, labs and B2B teams explain what they do — and look like they mean it.

Discovery sprint

Positioning workshop

Identity design

Start a project

● 0:42

Phone, 390 px

In Y2K Chrome

hero.video-split · hero

Open alone, full size (desktop, tablet, phone; layout tree included)

Brand & product studio

We make complicated companies simple to choose

Northfold is a 14-person studio helping manufacturers, labs and B2B teams explain what they do — and look like they mean it.

Discovery sprint

Positioning workshop

Identity design

Start a project

● 0:42

Corvid Robotics — identity

Desktop

Brand & product studio

We make complicated companies simple to choose

Northfold is a 14-person studio helping manufacturers, labs and B2B teams explain what they do — and look like they mean it.

Discovery sprint

Positioning workshop

Identity design

Start a project

● 0:42

Phone, 390 px

In Neo-Brutalism

hero.video-split · hero

Open alone, full size (desktop, tablet, phone; layout tree included)

Brand & product studio

We make complicated companies simple to choose

Northfold is a 14-person studio helping manufacturers, labs and B2B teams explain what they do — and look like they mean it.

Discovery sprint

Positioning workshop

Identity design

Start a project

● 0:42

Corvid Robotics — identity

Desktop

Brand & product studio

We make complicated companies simple to choose

Northfold is a 14-person studio helping manufacturers, labs and B2B teams explain what they do — and look like they mean it.

Discovery sprint

Positioning workshop

Identity design

Start a project

● 0:42

Phone, 390 px

Suits

Athletic Sport Y2K Chrome Neo-Brutalism Memphis Organic Earth Bento Tech Seventies Psychedelic Scandinavian Soft

Clashes with

Broadsheet Newspaper Classical Bookish Art Deco