Testimonial card with a quote, avatar with initials fallback, name and role, using semantic figure and blockquote markup. Built in Tailwind for landing pages.
npx shadcn@latest add @minidev/testimonialCode Testimonial sections for React and Tailwind
Free testimonial components for React and Tailwind CSS: quote cards, a testimonial carousel, a social proof wall, press quotes and avatar rows. One file each, MIT.
8 blocksFree, MITshadcn CLI compatibleTailwind CSS v4Light and dark
Testimonials work when they are specific: a real name, a role, a company and one sentence about a result. The components here give that content a shape, from a single quote card to a wall of cards and an auto-playing carousel.
Each one takes plain data, so the same quotes can appear in a hero, on the pricing page and in a case study without being retyped.
Testimonial Carousel
motionA React testimonial carousel that auto advances every few seconds with slide transitions, dot indicators using aria-current, and prev and next buttons.
npx shadcn@latest add @minidev/testimonial-carouselCode Social Proof Wall
blockA testimonial wall with a logo marquee that pauses on hover and three columns of quote cards drifting at different speeds, with metric chips and edge fades.
npx shadcn@latest add @minidev/social-proof-wallCode Social proof row of up to five overlapping avatars with initials fallback, next to a count label like 2,000 teams. Built in React for landing page heroes.
npx shadcn@latest add @minidev/social-proofCode A centered press or testimonial quote using figure, blockquote and figcaption, with a large quoted line and an uppercase source. Adds proof to landing pages.
npx shadcn@latest add @minidev/press-quoteCode Marquee Quotes
motionTwo rows of testimonial quotes scrolling in opposite directions as looping React marquees. Pass quote and name pairs; motion stops for reduced motion.
npx shadcn@latest add @minidev/marquee-quotesCode React avatar group that stacks overlapping avatars with tooltips, lifts one on hover, collapses extras into a +N chip with a popover list and falls back to tinted initials.
npx shadcn@latest add @minidev/avatar-groupCode Animated Tooltip
motionAnimated Tooltip is a React row of overlapping avatars where hovering or focusing one pops up a name and role card that tilts and slides with the pointer on springs.
npx shadcn@latest add @minidev/animated-tooltipCode Frequently asked questions
Should testimonials auto-rotate?
Only with a pause on hover and focus, a visible way to move by hand, and stillness under prefers-reduced-motion. The carousel here does all three. A static grid is often the safer choice.