Hero 72 - Centered hero with icon tooltips and split imagery

Pro

A centered hero with headline, supporting copy, hover tooltips on a muted icon row, and staggered photography with a wide second frame.

Shadcn Hero 72 block

Component data

ID
hero72
Access
pro
Created
Jan 1, 2025
Type
block
Libraries
Radix UI, Base UI, React Aria

Hero 72 block design & features

Hero72 is a centered hero built with shadcn/ui. A large headline and supporting paragraph sit above a row of compact muted icon tiles. Hovering a tile opens a tooltip with the feature title. Below the intro, two photographs sit in a staggered pair: a tall left frame and a wide sixteen-by-nine frame on the right.

The page stays light with dark type. Icon tiles use a muted fill, no border, and tight padding. The photographs use large corner radius, a hairline border, and a soft shadow. The right still is locked to a wide crop.

It reads as a product preview hero rather than a waitlist capture. The tooltip row keeps proof points without extra captions, and the wide second photograph is the distinctive media beat. Complexity is moderate: you need a headline, a short paragraph, labeled icons, and two photographs.

On small screens the icon row wraps, the right photograph hides, and the left frame stays full width.