Hero 202 - Split integration hero with orbital panel

Pro

Text column merges badge heading accent span Buttons while right bordered muted tile hosts OrbitingCircles halo offset integrating logo pool rotations.

Shadcn Hero 202 block

Component data

ID
hero202
Access
pro
Created
Mar 16, 2025
Type
block
Libraries
Radix UI, Base UI, React Aria
Figma

Hero 202 block design & features

Hero202 adopts a two-column scaffold built from shadcn/ui Buttons paired with OrbitingCircles inside a bordered muted tile. Badge-led kicker, heading with tonal accent span, optional description, plus primary and outline buttons occupy the narrative column while the orbital column rotates integration logos offset from sibling hero layouts.

Muted panel separates crisp bordered icon squares from roomy typography readability.

Straightforward scanning pace that pairs exposition with animated credentials.

Breakpoints stack the orbital frame beneath copy while easing circle radii tied to shrinking container widths.