Testimonial 7 - Dual auto-scrolling testimonial rows

Pro

A heading and supporting line above two looping rows of testimonial cards that scroll in opposite directions, each with an avatar, name, role, and quote.

Shadcn Testimonial 7 block

Component data

ID
testimonial7
Access
pro
Created
Aug 5, 2024
Type
block
Libraries
Radix UI, Base UI, React Aria
Figma

Testimonial 7 block design & features

Testimonial7 is a centered header plus two ticker rows built with Shadcn UI. A large heading and a muted supporting line sit above a pair of looping carousels. Each card shows a circular avatar, name, and role, then a quoted paragraph clipped to three lines. The top row scrolls one way and the bottom row scrolls the other.

A soft fade at each edge hides cards as they enter and leave the track. Cards use the default surface, compact type, and a thin ring on the avatar. Quotes stay muted against the name. Motion is continuous and slow; the rows loop, and scrolling resumes after a hover pause. Card width is capped so several sit in view at once.

The dual ticker is more elaborate than a static grid or a single carousel. Opposite directions and the edge fade give it a live social-feed feel while the cards themselves stay close to a default look. Complexity is moderate to elaborate and content-driven: you need a heading, a short description, and two sizable sets of quotes with avatar photos, names, and roles so the loops do not feel thin.