Founder Endorsement
A single prominent endorsement, styled larger and more editorial than a compact quote card: a bigger quote mark, a longer multi-sentence quote, and a large avatar with name and title. Meant for a founder, CEO, or other named executive whose credibility carries the section on its own.
Docs
Installation
A real shadcn registry command, not a copy-paste stand-in: it fetches this block plus its avatar, avatar-initials dependencies and any missing npm packages, and installs them straight into your project.
npx shadcn add https://staaarter.com/r/founder-endorsement.jsonPrefer not to use the CLI? Copy the source from the Code toggle above into src/components/blocks/testimonials/testimonial15.tsx instead.
Usage
The file also exports testimonial15Demo, the exact props behind the preview above. Spread it to get a working section in one line, then replace it with your own data.
import { Testimonial15, testimonial15Demo } from "@/components/blocks/testimonials/testimonial15"; export default function Page() { return <Testimonial15 {...testimonial15Demo} />; }
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| eyebrow | string | undefined | Small label above the quote mark, e.g. "Founder story". |
| quote | ReactNode | none | The endorsement quote. Accepts JSX so a phrase within it can be highlighted. |
| founder | Founder | none | Name, title, and optional avatar of the person quoted. |
| className | string | none | Extra classes for the outer section element. |
Types
type Founder = { name: string; title: string; avatar?: { src: string; alt: string }; };
Behavior notes
- Fully static/decorative: this is a Server Component with no event handlers or client state.
- The avatar is rendered larger (size-16 to size-20) than the compact-card blocks in this category to match the editorial framing described in the brief.
- Avatar renders a real photo when founder.avatar.src is provided and falls back to initials via initialsFromName otherwise.
More Testimonials Blocks
View all →Single Large Quote
One large centered pull-quote with a decorative quote mark and a simple avatar attribution below.
Three Column Grid
Responsive grid of quote cards, each with a star rating, avatar, name, role, and quote text.
Quote Carousel
Interactive one-at-a-time quote carousel with prev/next arrows and clickable dot indicators.
Video Testimonial Grid
Grid of video-style testimonial cards, each a 16:9 thumbnail with a play-button overlay and a caption.
Masonry Wall
"Wall of love" style masonry layout of many short quote cards using CSS columns, not a JS library.
Quote With Stats Sidebar
Split layout pairing a large quote and attribution with a sidebar of 2-3 result stats.