# FAQ

> Questions and answers as an accordion or a two-column list. Zero JS.

URL: https://apogee.avaui.dev/docs/sections/faq
Last updated: 2026-10-15

Questions and answers as an accordion or a two-column list. Zero JS.

Last updated October 15, 2026

```astro
<FAQ heading="Questions" items={[{ question, answer }, …]} />
```

## Add

```sh
npx @ava-ui/apogee add faq
```

## API

| Prop | Type | Default | Category | Description |
| --- | --- | --- | --- | --- |
| `eyebrow`, `heading`, `description` | `string` | — | content | Optional section header. |
| `items` | `{ question, answer }[]` | — | content | Required. |
| `label` | `string` | English | content | Landmark name when there is no heading. |
| `layout` | `'accordion' \| 'two-column'` | `'accordion'` | layout | The accordion opens one at a time. |
| `align` | `'start' \| 'center'` | `'start'` | layout | Header alignment. |
| `background`, `spacing`, `headingLevel`, `id` |  |  | layout | As on every section. |

## Layouts

```astro
<FAQ layout="two-column" items={…} />
<FAQ background="neutral-faded" align="center" items={…} />
```

## Accessibility

-   The accordion is native `details` elements with a shared `name`, so keyboard and screen-reader support come from the browser; the two-column layout uses headings one level below the section heading.