Testimonials

Minimal Testimonial Grid

Plain testimonials: a heading above three quotes on muted tiles, each with a name and role. Theme tokens only, light and dark.

Free, MIT licenseOpen in Browse
import { Heading } from "@/components/editorial/heading"
import {
  Quote,
  QuoteAuthor,
  QuoteAuthorName,
  QuoteAuthorRole,
  QuoteFigure,
  QuoteGroup,
} from "@/components/editorial/quote"
import {
  Section,
  SectionContent,
  SectionHeader,
  SectionTitleGroup,
} from "@/components/editorial/section"

// The copy: change text here, not in the markup.
const COPY = {
  title: "Teams that ship with Orbcore",
} as const

const QUOTES = [
  {
    quote:
      "Every decision now lives next to the work it changed. New hires catch up in an afternoon.",
    name: "Tomas Vey",
    role: "Engineering Lead, Halo Street",
  },
  {
    quote:
      "Our Monday meeting went from an hour to ten minutes, because the digest already said it.",
    name: "Ines Halloran",
    role: "Operations, Meridian Way",
  },
  {
    quote:
      "Review comments close when the change ships. Nothing sits open for weeks any more.",
    name: "Elias Quill",
    role: "Design Director, Comet Lane",
  },
] as const

export default function MinimalTestimonials02() {
  return (
    <Section>
      <SectionHeader>
        <SectionTitleGroup>
          <Heading>{COPY.title}</Heading>
        </SectionTitleGroup>
      </SectionHeader>
      <SectionContent>
        <QuoteGroup cols={3}>
          {QUOTES.map((item) => (
            <QuoteFigure key={item.name} variant="muted">
              <Quote>
                <p>{item.quote}</p>
              </Quote>
              <QuoteAuthor>
                <QuoteAuthorName>{item.name}</QuoteAuthorName>
                <QuoteAuthorRole>{item.role}</QuoteAuthorRole>
              </QuoteAuthor>
            </QuoteFigure>
          ))}
        </QuoteGroup>
      </SectionContent>
    </Section>
  )
}

Installation

pnpm dlx shadcn add @01orbital/minimal-testimonials-02
npx shadcn add @01orbital/minimal-testimonials-02
yarn shadcn add @01orbital/minimal-testimonials-02
bunx --bun shadcn add @01orbital/minimal-testimonials-02

Free under the MIT license. Add the @01orbital registry to components.json once (install guide), then run the command.

It lands at components/blocks/testimonials/minimal-testimonials-02/index.tsx, as source you own and edit.

Usage

import MinimalTestimonials02 from "@/components/blocks/testimonials/minimal-testimonials-02"

export default function Example() {
  return <MinimalTestimonials02 />
}

Dependencies

Registry pieces it installs with it: