726 / 1002

Testimonials Section

A heading and quote cards in a looping horizontal strip that pauses on hover. Falls back to a static grid.

Loved by teams everywhere

Thousands of teams rely on us every day. Here is what a few of them have to say.

We replaced three internal tools with this and cut our release cycle in half. The team adopted it in a single afternoon.
MJMaya JohnsonHead of Product, Northwind
The details are what sold me. Every interaction feels considered, and support answers within minutes, not days.
DODaniel OkaforEngineering Manager, Lumen Labs
Our customers noticed the difference right away. Load times dropped and our conversion rate climbed the same week.
SASofia AlvarezGrowth Lead, Brightside
Clean docs, honest pricing and an API that does what it says. It is rare to find all three in one product.
LCLiam ChenStaff Engineer, Fieldwork
I was skeptical at first, but the migration took one day and nothing broke. We have not looked back since.
PRPriya RamanCTO, Oakline
It gives our designers and developers a shared language. Handoffs that used to take a week now take an hour.
TBTom BeckerDesign Director, Parallel

We replaced three internal tools with this and cut our release cycle in half. The team adopted it in a single afternoon.
MJMaya JohnsonHead of Product, Northwind
The details are what sold me. Every interaction feels considered, and support answers within minutes, not days.
DODaniel OkaforEngineering Manager, Lumen Labs
Our customers noticed the difference right away. Load times dropped and our conversion rate climbed the same week.
SASofia AlvarezGrowth Lead, Brightside
Clean docs, honest pricing and an API that does what it says. It is rare to find all three in one product.
LCLiam ChenStaff Engineer, Fieldwork
I was skeptical at first, but the migration took one day and nothing broke. We have not looked back since.
PRPriya RamanCTO, Oakline
It gives our designers and developers a shared language. Handoffs that used to take a week now take an hour.
TBTom BeckerDesign Director, Parallel

Install

terminal

npx shadcn@latest add https://hyperblur.dev/r/testimonials-section.json

Works in any React project set up with the shadcn CLI. The file lands in components/hyperblur/testimonials-section.tsx.

Use

example.tsx

import { TestimonialsSection } from "@/components/hyperblur/testimonials-section"

<TestimonialsSection testimonials={[{ quote: "Great product.", name: "Maya Johnson", role: "Head of Product", company: "Northwind" }]} />

Props

Prop	Type	Default	Description
title	string	"Loved by teams everywhere"	Section heading.
subtitle	string	sample text	Supporting text under the heading.
testimonials	{ quote: string; name: string; role: string; company?: string; avatar?: ReactNode }[]	6 sample testimonials	Cards to render. Without an avatar, initials from the name are shown.
accent	string	"#2f7bff"	Accent color for quote marks, avatars and card hover border.
autoScroll	boolean	true	Auto-scroll the strip and pause on hover. When false, or with reduced motion, cards show as a static grid.

PreviousBento Spotlight NextCase Study Cards

Bento Spotlight Case Study Cards