# Section simple 05

> A centred quote with its author.

URL: https://apogee.avaui.dev/docs/content-sections/section-simple-05
Last updated: 2026-10-20

A centred quote with its author.

Last updated October 20, 2026

Live example: https://apogee.avaui.dev/examples/content/section-simple-05

```astro
---
/**
 * Section simple 05: A centred quote with its author.
 *
 * @block content
 * @order 20
 */
import Section from '@/components/apogee/Section/Section.astro'
import Avatar from '@/components/apogee/Avatar/Avatar.astro'
import Blockquote from '@/components/apogee/Blockquote/Blockquote.astro'
import type { ContentContent } from '@/components/apogee/sections/_shared/content.ts'

/** @composable */
interface Props extends ContentContent {
  /** The quote, without quote marks. @category content */
  quote?: string
}

const {
  quote = 'We stopped arguing about buttons and started arguing about the product. That was the point.',
  author = { name: 'Ada Lovelace', role: 'Design Lead, Oakmere' },
} = Astro.props
---

<Section spacing="large" containerWidth="medium">
  <figure class="m-0 flex flex-col items-center gap-8 text-center">
    <Blockquote class="border-0 p-0 text-2xl font-medium text-balance md:text-4xl">“{quote}”</Blockquote>
    {author && (
    <figcaption class="flex flex-col items-center gap-3">
      <Avatar name={author.name} size="xlarge" />
      <div>
        <p class="font-semibold">{author.name}</p>
        {author.role && <p class="text-neutral-faded">{author.role}</p>}
      </div>
    </figcaption>
    )}
  </figure>
</Section>
```

## Add

```sh
npx @ava-ui/apogee add content/section-simple-05
```

This copies the block to `src/components/apogee/blocks/content/` with everything it uses: Avatar, Blockquote, Section. Every piece of copy is a prop, with the sample copy as its default. Pass yours, or `null` to hide a part; see [copy is props](https://apogee.avaui.dev/docs/content-sections#copy-is-props).

## Accessibility

-   The heading is an `h2` by default, so the block slots into a page under its `h1`; item titles are one level down.

## Related

[

ProseTypography styling for a block of rich, CMS, or markdown HTML you don't control element by element.

](https://apogee.avaui.dev/docs/prose)[

ShareLinksWays to pass a page on; Copy link, the device's share sheet and email.

](https://apogee.avaui.dev/docs/share-links)[

TableOfContentsThe sections of a long page as in-page links in a named nav; one level of nesting and a current marker.

](https://apogee.avaui.dev/docs/table-of-contents)