Components
Editorial 3-up testimonial grid with a gold quote glyph, motion stagger on viewport entry, and hover-lift on each card. Drop in, pass a testimonials array, done.
Loading preview...
import Testimonials, { type Testimonial } from "@/components/ui/testimonials-quote-cards";
const SAMPLE: Testimonial[] = [
{
quote:
"They sketched the ring on a napkin during our first visit. Six weeks later, my wife cried when she saw it.",
author: "Daniel R.",
context: "Engagement ring · 2025",
},
{
quote:
"We chose them because it's still a family bench — no markup, no middleman. They reset my grandmother's diamond into a setting that finally feels mine.",
author: "Priya S.",
context: "Heritage reset",
},
{
quote:
"Three rings in seven years. They remember what every stone means in our story. That's not a jeweler, that's family.",
author: "Marcus & Renee L.",
context: "Repeat clients since 2018",
},
];
export default function TestimonialsDemo() {
return (
<Testimonials
eyebrow="Voices from the bench"
heading={
<>
Stories that <span className="text-gold-gradient">last.</span>
</>
}
testimonials={SAMPLE}
/>
);
}