Testimonials
Testimonial - Rotating
A single large quote that cross-fades and blurs between testimonials on an interval.
- AnimatePresence
- Blur transition
- Manual controls
Customize
Drag a slider and watch the preview respond live. Every control maps to a typed prop - what you tune is what you ship.
How the animation works
One large quote is shown at a time, and on an interval the component cross-fades to the next testimonial while briefly blurring the outgoing and incoming text so the swap feels soft rather than abrupt. Manual controls let the visitor step through the quotes themselves instead of waiting for the timer.
When to use it
- A focused testimonial section where one strong quote at a time carries more weight
- A page with limited vertical space that still needs to rotate through proof
- Any section where you want a calm, premium feel over a dense testimonial wall
Props you can tune
Every prop below is live in the studio above and ships typed with the component.
- 2-10s
intervalRotate every
Related components
Using this block
Buy it, then copy components/blocks/testimonial-rotating/index.tsx into your project. A single file - no new dependency beyond the Framer Motion + Tailwind you already have.