Quote With Rating Bars
A review summary with average score, star row, and histogram bars beside a featured quote.
A review summary with average score, star row, and histogram bars beside a featured quote.
Search blocks by description or jump to a page.
The source for every Marketing block is included with Basic and Pro. Pick a plan to copy the code.
Already purchased? Log in
Quote With Rating Bars pairs aggregate proof with a single voice. One bordered panel holds two halves: on the left, a large average score with a star row, the review count, and a five row histogram whose bar widths come from data, and on the right, a featured quote with avatar, name, and role, separated by a hairline rule. The histogram says thousands agree, the quote says here is one of them.
The histogram is one array of star level, width, and share label, so the distribution redraws from numbers, and the score, count, and stars are independent strings and values. The bars are plain divs inside rounded tracks, no chart library. Swap the quote like any testimonial, the strongest pick is one that talks about expectations matching reality.
Reach for this block when buyers in your category check review platforms before talking to sales. It frontloads the score they would go looking for, with a distribution that reads as honest because it shows the imperfect rows too. It beats quote-with-metrics when the credibility question is what does everyone think rather than what did one team achieve, and single-quote-banner when you can back the voice with volume.
A natural flow around it on a Marketing Pro page:
Before
After
One strong use is review platform ratings with a customer who echoes them. Other distributions that fit:
Tip: keep a visible sliver on the one and two star rows, a distribution with empty bottom rows reads as filtered.