Hero 126 block design & features
Hero126 is a video-first hero built with shadcn/ui. A single framed player fills the container: a looping muted preview, a circular play-pause control in the corner with a progress ring, and a two-column credits dock with badge, headline, speaker byline, promo line, supporting copy, and paired buttons. The control toggles playback on the preview itself.
The frame uses a hairline border and shared corner radius so the preview and credits read as one unit. On wide layouts the dock sits as a lower-third over a background fade; type stays solid and left-aligned, with the title on one side and the story plus actions on the other.
It feels like a screening room more than a launch banner. The media carries the first impression and the copy reads as program notes, which is a less common hero pattern than a centered stack or a split column. Complexity stays moderate: a looping preview with progress-aware playback, and a responsive credits dock.
On narrow viewports the credits stack under the preview while the play control stays in the top corner of the video.