Testimonial Carousel

Minimal, responsive testimonial slider with avatars, names, and quotes for clean, modern design.

Loading...

Installation

npx shadcn@latest add @scrollxui/testimonial-carousel 

Usage

import TestimonialCarousel from '@/components/ui/testimonial-carousel';
<TestimonialCarousel
  data={[
    {
      description:
        'ScrollX-UI has completely transformed how I build interfaces. The animations are silky smooth, and the components are modular and responsive.',
      image:
        'https://images.unsplash.com/photo-1611558709798-e009c8fd7706?q=80&w=2070&auto=format&fit=crop&ixlib=rb-4.0.3',
      name: 'Isabelle Carlos',
      handle: '@isabellecarlos',
    },
    {
      description:
        'I love how ScrollX-UI makes my projects look professional with minimal effort. The documentation is clear and the community is super helpful.',
      image:
        'https://plus.unsplash.com/premium_photo-1692340973636-6f2ff926af39?q=80&w=2070&auto=format&fit=crop&ixlib=rb-4.0.3',
      name: 'Lana Akash',
      handle: '@lanaakash',
    },
    {
      description:
        'The smooth scrolling animations and intuitive components in ScrollX-UI save me hours of development time!',
      image:
        'https://images.unsplash.com/photo-1552374196-c4e7ffc6e126?q=80&w=2070&auto=format&fit=crop&ixlib=rb-4.0.3',
      name: 'Liam O’Connor',
      handle: '@liamoc',
    },
  ]}
/>

Examples


Gradient

Loading...

API Reference

Testimonial Carousel

Minimal, responsive testimonial slider with avatars, names, and quotes for clean, modern design.

Props

PropertyTypeDefaultDescription
dataTestimonial[]required
Array of testimonial objects to display. Each object must have name, handle, image, and description.
borderType"solid" | "gradient""solid"
Type of border around avatars.

Built withby Ahdeetai.