Testimonials Rating
Store-style review summary with an average, a star histogram that filters, and verified reviews.
- Type: Testimonials section
- Styles: Light, Minimal
- Licence: Charcoal UI Pro
About Testimonials Rating
Testimonials Rating looks like the reviews block on a good store page: the average score, total reviews, a bar for each star level that filters the list when clicked, and verified reviews with dates.
It is a full-width testimonials section for React and Tailwind CSS 4, in a light and minimal style. Preview it at any width above, then install it with one command.
When to use Testimonials Rating
- E-commerce and hardware.
- Apps with App Store ratings.
- Local businesses and clinics.
- Marketplaces and services.
How it is built
The average is computed from your distribution, bars grow into view, and filtering animates the list. Reviews take stars, title, body, date and a verified flag.
It is composed from Rating, so installing it also installs those components, and you can restyle each one the same way you would on its own.
Goes well with Testimonials Rating
Testimonials Rating is part of 20 full templates, so you can see it in a finished page.
- Halcyon template: Support that answers in seconds.
- Atelier template: A gallery that happens to have a checkout.
- Roastery template: Build a box, save every delivery.
- Halo template: One product, every angle.
- Fernhouse template: Plants that arrive happy.
- Groove template: One great record, every month.
- Juniper template: Wood fire, small plates, booked tables.
- Fixwell template: Book a pro in two minutes.
- Fade template: Book a chair, skip the wait.
- Timberline template: Cabins within three hours of the city.
- Brightside template: A dentist people don't dread.
- Stillwater template: Treatments, booked in a breath.
- Vault template: Save without thinking about it.
- Canopy template: Insurance explained in plain English.
- Carebridge template: See a doctor today, from your sofa.
- Lotus template: Classes, teachers and a timetable.
- Nocturne template: A bedside device that fixes your nights.
- Lingo template: Speak a new language in 15 minutes a day.
- Tutorly template: The right tutor, this week.
- Pocket template: Launch an app, get the downloads.
- Testimonials Marquee: A React testimonials marquee: two rows of quotes drifting opposite ways
- Testimonials Wall: A React testimonials wall: a masonry of quotes with ratings revealed on scroll
- Testimonials Spotlight: A React testimonial spotlight: one big quote at a time with avatar switching
- Testimonials Video: React video testimonial cards that expand with captions and progress on play
- Rating: An animated React star rating with hover preview and a ripple of popping stars
Install Testimonials Rating
npx shadcn@latest add @charcoal/testimonials-ratingTestimonials Rating is part of Charcoal UI Pro: one seat covers all 107 sections, 100 templates and 300 Pro components, for unlimited projects. The command installs the section into components/sections along with every component it uses.
Frequently asked questions
- Does Testimonials Rating work with Next.js?
- Yes. It is a React 19 component styled with Tailwind CSS 4, so it drops into a Next.js page, a Vite app, Remix or Astro.
- Can I change the copy and colours?
- Yes. The section is a file in your project. Text, links and images are plain props or JSX, and colours come from your theme's CSS variables, so a brand change is a token edit.
Built from
- Rating: Star rating with a hover preview. Picking a score pops the stars in a ripple from the left.