Hero 125 - Returns-focused hero with product card

Pro

A two-column Shadcn UI hero with cart label, bold headline, muted subcopy, demo button, and a card showing product art plus exchange, shop, and refund actions.

Shadcn Hero 125 block

Component data

ID
hero125
Access
pro
Created
Dec 16, 2024
Type
block
Libraries
Radix UI, Base UI, React Aria

Hero 125 block design & features

Hero125 is a two-column hero built with Shadcn UI over a large soft circle pattern and a white gradient fade at the bottom. The left stack leads with a shopping-cart label row, a strong headline about returns, large muted supporting text, and a rounded primary demo button.

The right side shows a phone-width card with bordered shadow, a hero image slot, and a compact toolbar of pill chips for exchange, shop now, and refund with Lucide icons.

Bright, commerce-adjacent presentation with plenty of air around the type and a self-contained product preview. Moderate complexity thanks to the decorative background and layered card footer.

The layout collapses to one column on small screens while keeping the card centered.