Testimonial Grid
Testimonials
Source and install need .
pnpm dlx shadcn@latest add @assembli/review-summaryReview Summary
Customer reviews section: the average, partial stars and a five-row breakdown where every row is a filter, beside the reviews. Mentioned-in-reviews chips filter by topic and highlight it in the text, a select sorts, long reviews expand in place, Helpful counts the visitor's vote, and team replies sit under the review they answer. Active filters show as removable tokens.
Props
Other props pass through to the root element.
eyebrow
React.ReactNode
Default
"Reviews"title
React.ReactNode
Default
"What customers say"reviews*
ReviewSummaryReview[]
distribution
[number, number, number, number, number]
Counts for 5, 4, 3, 2 and 1 stars across every review you have, when
reviewsis only a sample. The average and total come from it. Defaults to countingreviews.topics
string[]
Default
[]"Mentioned in reviews" chips. Each needs a matching entry in a review's
topics.recommend
number
Share who would recommend you, 0–1, shown under the breakdown.
writeHref
string
Where "Write a review" goes. Hidden when unset.
brand
string
Default
"Our team"Your company's name on replies.
pageSize
number
Default
4starColor
string
Default
"oklch(0.8 0.16 78)"Star color, any CSS color.
| Description | |||
|---|---|---|---|
| eyebrow | React.ReactNode | "Reviews" | |
| title | React.ReactNode | "What customers say" | |
| reviews* | ReviewSummaryReview[] | – | |
| distribution | [number, number, number, number, number] | – | Counts for 5, 4, 3, 2 and 1 stars across every review you have, when |
| topics | string[] | [] | "Mentioned in reviews" chips. Each needs a matching entry in a review's |
| recommend | number | – | Share who would recommend you, 0–1, shown under the breakdown. |
| writeHref | string | – | Where "Write a review" goes. Hidden when unset. |
| brand | string | "Our team" | Your company's name on replies. |
| pageSize | number | 4 | |
| starColor | string | "oklch(0.8 0.16 78)" | Star color, any CSS color. |
Related
Block
Testimonial Columns
Testimonials
Testimonial Marquee
Testimonials
Case Study Tabs
Testimonials