Hero 116

Pro

A content block with a video pop-up feature, including a headline, subtext, and two action buttons, enriched with interactive image placements.

Figma

Shadcn UI Hero Block

The Hero116 component is a visually engaging shadcn UI block designed to captivate users with a compelling message and clear calls to action. It features a prominent headline and subheadline, paired with interactive buttons that encourage exploration and conversion. The component integrates visual elements seamlessly by incorporating an image grid, enriching the overall aesthetic while maintaining a professional layout.

Diving deeper into the mechanics of Hero116, it comprises a blend of typographic hierarchy and dynamic interactivity. The headline is bold and central, instantly drawing attention, while the subheadline succinctly communicates the primary value proposition. The interactive buttons are implemented to provide users with intuitive pathways to either learn more about the services through a video demonstration or to initiate engagement by getting started. The component also includes an array of strategically placed images, which add depth and texture to the design. Furthermore, a dialog containing a presentation video can be triggered, allowing users to delve into a multimedia experience.

Dependencies

PackageType
lucide-reactNPM
reactNPM
aspect-ratio
@shadcn
Registry
button
@shadcn
Registry
dialog
@shadcn
Registry