---
title: "Testimonial"
description: "A customer quote with author and company attribution."
canonical_url: "https://sanity-id-docs.sanity.build/sanity-id/components/testimonial"
md_url: "https://sanity-id-docs.sanity.build/sanity-id/components/testimonial.md"
docs_index: "https://sanity-id-docs.sanity.build/sanity-id/llms.txt"
version: "1.15.2"
---

> Part of the Sanity ID reference. The index of every page is at https://sanity-id-docs.sanity.build/sanity-id/llms.txt.

# Testimonial

A customer quote with author and company attribution.

```tsx
import { Testimonial } from "@sanity/sanity-id/components/testimonial"
```

## Props

| Prop | Type | Required | Default | Description |
| --- | --- | --- | --- | --- |
| `align` | `"left" \| "center"` | no | `"left"` | Text alignment. Large size is always center-aligned |
| `authorImage` | `string \| ((props: ComponentProps<"img">) => ReactNode)` | no | — | Author avatar image URL or custom render function |
| `authorName` | `string` | no | — | Author's display name |
| `authorTitle` | `string` | no | — | Author's job title |
| `border` | `"none" \| "auto"` | no | — | Border style |
| `className` | `string` | no | — | Additional CSS classes |
| `companyImage` | `string \| ((props: ComponentProps<"img">) => ReactNode)` | no | — | Company logo URL or custom render function |
| `companyName` | `string` | no | — | Company name |
| `quote` | `string \| ReactNode` | no | — | The testimonial quote |
| `size` | `"small" \| "medium" \| "large"` | no | `"medium"` | Size variant |

## Usage

### Small, left-aligned

```tsx
import { Testimonial } from "@sanity/sanity-id/components/testimonial"

export default () => {
	const testimonial = {
		quote: "Adipisicing velit veniam id dolore reprehenderit enim voluptate ad qui ex officia. Officia pariatur reprehenderit culpa incididunt ea.",
		authorName: "Magnus Hillestad",
		authorImage: "https://cdn.sanity.io/images/3do82whm/next/fc4624b219eb58749320e4fe96cd4d675045f568-200x200.jpg",
		authorTitle: "CEO and co-founder",
		companyName: "Sanity",
		companyImage: "https://cdn.sanity.io/images/3do82whm/next/9a1e5c003b9c1a44f554c71f77694a12c5152eab-81x40.svg",
	}
	return (
		<Testimonial {...testimonial} align="left" size="small" border="auto" />
	)
}
```

### Small, center-aligned

```tsx
import { Testimonial } from "@sanity/sanity-id/components/testimonial"

export default () => {
	const testimonial = {
		quote: "Adipisicing velit veniam id dolore reprehenderit enim voluptate ad qui ex officia. Officia pariatur reprehenderit culpa incididunt ea.",
		authorName: "Magnus Hillestad",
		authorImage: "https://cdn.sanity.io/images/3do82whm/next/fc4624b219eb58749320e4fe96cd4d675045f568-200x200.jpg",
		authorTitle: "CEO and co-founder",
		companyName: "Sanity",
		companyImage: "https://cdn.sanity.io/images/3do82whm/next/9a1e5c003b9c1a44f554c71f77694a12c5152eab-81x40.svg",
	}
	return (
		<Testimonial {...testimonial} align="center" size="small" />
	)
}
```

### Medium, left-aligned

```tsx
import { Testimonial } from "@sanity/sanity-id/components/testimonial"

export default () => {
	const testimonial = {
		quote: "Adipisicing velit veniam id dolore reprehenderit enim voluptate ad qui ex officia. Officia pariatur reprehenderit culpa incididunt ea.",
		authorName: "Magnus Hillestad",
		authorImage: "https://cdn.sanity.io/images/3do82whm/next/fc4624b219eb58749320e4fe96cd4d675045f568-200x200.jpg",
		authorTitle: "CEO and co-founder",
		companyName: "Sanity",
		companyImage: "https://cdn.sanity.io/images/3do82whm/next/9a1e5c003b9c1a44f554c71f77694a12c5152eab-81x40.svg",
	}
	return (
		<Testimonial {...testimonial} align="left" size="medium" />
	)
}
```

### Medium, center-aligned

```tsx
import { Testimonial } from "@sanity/sanity-id/components/testimonial"

export default () => {
	const testimonial = {
		quote: "Adipisicing velit veniam id dolore reprehenderit enim voluptate ad qui ex officia. Officia pariatur reprehenderit culpa incididunt ea.",
		authorName: "Magnus Hillestad",
		authorImage: "https://cdn.sanity.io/images/3do82whm/next/fc4624b219eb58749320e4fe96cd4d675045f568-200x200.jpg",
		authorTitle: "CEO and co-founder",
		companyName: "Sanity",
		companyImage: "https://cdn.sanity.io/images/3do82whm/next/9a1e5c003b9c1a44f554c71f77694a12c5152eab-81x40.svg",
	}
	return (
		<Testimonial {...testimonial} align="center" size="medium" />
	)
}
```

### Large (always center-aligned)

```tsx
import { Testimonial } from "@sanity/sanity-id/components/testimonial"

export default () => {
	const testimonial = {
		quote: "Adipisicing velit veniam id dolore reprehenderit enim voluptate ad qui ex officia. Officia pariatur reprehenderit culpa incididunt ea.",
		authorName: "Magnus Hillestad",
		authorImage: "https://cdn.sanity.io/images/3do82whm/next/fc4624b219eb58749320e4fe96cd4d675045f568-200x200.jpg",
		authorTitle: "CEO and co-founder",
		companyName: "Sanity",
		companyImage: "https://cdn.sanity.io/images/3do82whm/next/9a1e5c003b9c1a44f554c71f77694a12c5152eab-81x40.svg",
	}
	return (
		<Testimonial {...testimonial} align="center" size="large" />
	)
}
```

