Feature 214 - AI headline with video-on-hover carousel

Pro

Centered serif title and subcopy lead into a shadcn/ui carousel of tall muted cards; each card shows a muted video that plays on hover, a corner icon chip, title, description, and link.

Shadcn Feature 214 block

Component Data

  • ID:feature214
  • Access:pro
  • Created:Mar 30, 2025
  • Type:block

Feature 214 block design & features

This block centers an expressive serif heading and supporting paragraph, then hands off to a carousel built with shadcn/ui carousel primitives and elevated cards. Each slide links as a whole card, with a fixed-height video area up top, a small rounded icon badge overlapping the corner, and stacked title plus description text beneath. Pointer enter plays the muted clip and pointer leave resets it.

Carousel slides use a muted card shell with a subtle shadow lift on hover. Navigation chevrons sit in a row under the track. Slide widths step from one-up on phones toward four-up on extra-wide displays so users peek neighboring cards. Typography in the body copy stays large for readability.

The combination of editorial header typography and hover-driven video gives a premium product-demo feel suited to AI tooling narratives, even though the pattern could cover any short feature list. Complexity sits in asset prep: you need lightweight looping videos, matching iconography, and concise headlines. Without footage the block loses most of its punch.

Because videos autoplay only while hovered and stay muted, mobile users see posters until they tap into the linked destination unless you adjust behavior separately.