Kinetic Testimonials

Smoothly scrolling, animated testimonials for modern developer websites to showcase user feedback visually.

Installation

npx shadcn@latest add @scrollxui/kinetic-testimonials

Usage

import KineticTestimonial from "@/components/ui/kinetic-testimonials";

<KineticTestimonial
      testimonials={testimonials}
      className="bg-linear-to-br from-slate-100 to-slate-200 dark:from-black dark:to-black md:py-0 py-0 not-prose"
      cardClassName="hover:scale-105 shadow-lg"
      avatarClassName="ring-2 ring-purple-500"
      desktopColumns={3}
      tabletColumns={3}
      mobileColumns={2}
      speed={1.5}
      title="Customer Reviews"
      subtitle="What our users think about our product"
    />

API Reference

Kinetic Testimonial

Showcasing testimonials with smooth scrolling and subtle animations for modern websites.

Props

Property	Type	Default	Description
`testimonials`	Testimonial[]	`[]`	Array of testimonial objects.
`className`	string	`-`	Optional className for the root container.
`cardClassName`	string	`-`	Optional className passed to individual testimonial cards
`avatarClassName`	string	`-`	Optional className passed to the Avatar component.
`desktopColumns`	number	`6`	Number of columns displayed on desktop (xl screens).
`tabletColumns`	number	`3`	Number of columns displayed on tablets.
`mobileColumns`	number	`2`	Number of columns displayed on mobile screens.
`speed`	number	`1`	Controls the animation speed of scrolling testimonials.
`title`	string	`Reviews`	Main heading text shown at the top of the testimonial section.
`subtitle`	string	`about reviews`	Secondary text below the title