Avatar Quote Row
Three short quote cards in a row each opening with the avatar and name before the quote, for fast scannable social proof across a range of client types.
Three short quote cards in a row each opening with the avatar and name before the quote, for fast scannable social proof across a range of client types.
Search blocks by description or jump to a page.
The source for every Portfolio block is included with Basic and Pro. Pick a plan to copy the code.
Already purchased? Log in
Avatar Quote Row puts three short endorsements in a horizontal grid, each card opening with the avatar and attribution before the quote so visitors know who is speaking before they read a word. Riley Parker at Field Notes Editorial on a component library still running six months later, Noah Park at Bloom Studio on a user need surfaced after two years of designing around it, and Sofia Reyes at Meridian Health on being the rarest kind of designer: one the developers trust. The heading: What clients say.
Quotes are one array of three objects each with an Avatar component. Leading with the avatar is the distinctive choice: it anchors the quote in a real person before the claim is made, which changes how the claim reads.
Reach for this block as a lightweight proof row on a homepage, below a work grid or a services section, where three short quotes scan faster than one long one. The installer swaps the three quotes, names, roles, companies, and avatar components for their own references.
A natural flow around it on a Portfolio Pro page:
Before
After
One strong use is the three-client proof row for a freelancer with a range of reference types. Other avatar quote row uses:
Tip: keep each quote to two or three sentences; a trimmed quote that says one clear thing lands harder than a long one that tries to say everything.