# Testimonial — single

> One large customer quote, with an optional portrait beside it or a tinted background.

Facade UI item `testimonial-single` (block, section).
Docs page: https://facadeui.dev/components/testimonial-single · Registry JSON: https://facadeui.dev/r/testimonial-single.json

## Install

```bash
npx shadcn@latest add @facade/testimonial-single
```

Or by URL: `npx shadcn@latest add https://facadeui.dev/r/testimonial-single.json`. The CLI also installs what it needs: @facade/container, @facade/section, @facade/testimonial, @facade/types, @facade/utils.

Files: `components/sections/testimonial-single.tsx`

Usage example as an installable item: `npx shadcn@latest add @facade/testimonial-single-demo` (lands in components/examples/).

## Usage

The source of the preview on the docs page. `./content` holds sample data.

```tsx
import { TestimonialSingle } from "@/components/sections/testimonial-single"

import { QUOTES } from "./content"

export function Demo() {
  return <TestimonialSingle title="Customer story" item={QUOTES[0]!} variant="muted" />
}
```

## Props

### TestimonialSingleProps

Extends Omit<SectionBaseProps, "headingLevel">.

| Prop | Type | Default | Description |
| --- | --- | --- | --- |
| `item` (required) | `TestimonialItem` |  |  |
| `image` | `ImageComponent` |  |  |
| `title` | `string` |  | A section name only screen readers get, so the section can be a landmark. |
| `logoSrc` | `string` |  | Company logo shown above the quote. Decorative. |
| `logoAlt` | `string` | `""` |  |
| `media` | `ReactNode` |  | Portrait or media beside the quote. |
| `variant` | `"plain" \| "muted" \| "card"` | `"plain"` |  |
| `align` | `"start" \| "center"` | `"center"` |  |
| `children` | `ReactNode` |  |  |
