saturation/uisaturation/ui
DocsComponentsBlocksPages
GitHub

Sections

IntroductionComponentsInstallationMCPTheming

Components

ComponentsAccordionAI Chat InputAlertAnimated GroupAnimated NumberAvatarBadgeBeamBlur FadeBorder TrailBreadcrumbButtonButton GroupCalendar PickerCardChartCheckboxCollapsibleComboboxCommandComparison SliderContext MenuCredit CardData TableDate PickerDialogDropdown MenuEmoji PickerEmptyFieldFiltersFull CalendarGlow EffectInputInput GroupInput OTPItemKanbanKbdMenubarNavigation MenuNovel EditorPaginationParallaxProgressProgressive BlurRadio GroupRippleSelectSeparatorSheetSkeletonSliderSonnerSpinnerSpotlightSwitchTableTabsText EffectText ShimmerTextareaToggleToggle GroupTreeTypography

Testimonial Carousel

An auto-advancing testimonial carousel with animated transitions, star ratings, avatar attribution, and progress dots.

What our customers are saying

This completely transformed how we manage our production budgets. Real-time visibility into spending changed everything for our team.

SC

Sarah Chen

IMDb

Executive Producer, Horizon Pictures

G2G2

Features

  • Auto-advancing — Cycles through testimonials with configurable interval
  • Pause on hover — Stops auto-advance when user hovers
  • Animated transitions — Smooth fade + slide via motion/react
  • Star ratings — Optional 1-5 star display
  • Avatar attribution — Composes Avatar component with image or initials fallback
  • Progress dots — Clickable dots with active indicator
  • Reduced motion — Respects prefers-reduced-motion

API Reference

PropTypeDefaultDescription
itemsTestimonial[]-Array of testimonial objects
titlestring"What our customers are saying"Section heading
intervalnumber6000Auto-advance interval in ms (0 to disable)
classNamestring-Additional className for the section

Components Used

avatar