Testimonial Marquee
Infinite scrolling customer testimonials with star ratings.
Preview
Hover to pause animation
“This platform transformed how we evaluate our AI models. The metrics are incredibly comprehensive.”
Sarah Chen
ML Engineer at TechCorp
“Finally, a tool that makes model comparison simple and intuitive. Saved us weeks of work.”
James Wilson
Data Scientist at DataFlow
“The LLM-as-judge feature is a game changer for our complex evaluation pipelines.”
Maria Garcia
AI Lead at InnovateLabs
“Best-in-class UI for model benchmarking. Our team adoption was instant.”
Alex Kim
VP Engineering at ScaleAI
“This platform transformed how we evaluate our AI models. The metrics are incredibly comprehensive.”
Sarah Chen
ML Engineer at TechCorp
“Finally, a tool that makes model comparison simple and intuitive. Saved us weeks of work.”
James Wilson
Data Scientist at DataFlow
“The LLM-as-judge feature is a game changer for our complex evaluation pipelines.”
Maria Garcia
AI Lead at InnovateLabs
“Best-in-class UI for model benchmarking. Our team adoption was instant.”
Alex Kim
VP Engineering at ScaleAI
Props
Component API reference
| Prop | Type | Default | Description |
|---|---|---|---|
testimonials | Testimonial[] | Default testimonials | Array of testimonials to display |
duration | number | 45 | Animation duration in seconds |
pauseOnHover | boolean | true | Pause animation on hover |
starCount | number | 5 | Number of stars to display |
className | string | — | Additional CSS classes |
Usage
Import and implementation examples
import { TestimonialMarquee } from '@/components/marquee'
<TestimonialMarquee
testimonials={[
{
quote: "This platform transformed how we work.",
author: "Sarah Chen",
role: "ML Engineer",
company: "TechCorp",
avatar: "SC"
},
{
quote: "Saved us weeks of development time.",
author: "James Wilson",
role: "Data Scientist",
company: "DataFlow",
avatar: "JW"
},
]}
/>Features
Built-in functionality
- Testimonial cards: Rich cards with quotes and ratings
- 5-star ratings: Visual star rating display
- Author avatars: Initials with gradient background
- Role and company: Full attribution information
- Slow scroll: 45s duration for readability
- Pause on hover: Stop to read testimonials
- Gradient fade edges: Smooth edge transitions
- Dark mode: Full dark mode support
Accessibility
Accessibility considerations
ARIA Attributes
role="list" for testimonial containeraria-label for star ratingsKeyboard Navigation
| Key | Action |
|---|---|
| Hover | Pause animation |
Notes
- Slow animation allows time to read
- Pause on hover for full reading
- Star ratings have accessible labels