# Accordions

> Add questions that open to their answers, a product's details or numbered steps, and choose what starts open.

Source: https://uxdeck.app/guide/accordions (checked against uxdeck on 16 October 2026)

Four Blocks are accordions: a list of headers that each open to a panel. They open one at a time or several together, and work with a keyboard and a screen reader. Use one for questions and answers, for details a buyer may want, or for steps that would make a page too long if they were all open.

Add one from **Blocks** in the toolbar (see [Add and style Blocks](/guide/blocks)), then select it to see its **Accordion** section in the Design tab.

## The settings

Every accordion has the same settings:

- **Items:** **−** removes the last item, **+** adds a copy of the last one (one item at least).
- **Starts open:** **None**, or the item that is open when the page opens (**Item 1**, **Item 2** and so on).
- **One open at a time:** opening an item closes the one that was open.

On the canvas every item shows open, so you can write in all of them. **Preview** and your site start as the settings say.

## Accordion

Questions that open to their answers, one at a time or several. Each item is a question with a **+** and an answer in a sentence or two.

It starts with **One open at a time** on and **Item 1** open.

## FAQ list

A plain list of questions and answers between hairlines, all closed until opened.

It starts with **Starts open** at **None**, and several answers can be open at once.

## Details

A product's details in one card: description, sizes, delivery and returns, each opening on its own.

It starts with **Item 1** open, and several sections can be open at once. Rename each section's header to what it holds.

## Steps

How it works, step by step: each numbered step opens to what happens in it, one at a time.

It starts with **One open at a time** on and the first step open. A step added with **Items** is a copy of the last one, so change its number and words.

## Catches

- **Every item looks open on the canvas.** That is so you can edit them; check Preview to see how the page opens.
- **Every item needs its header and panel.** Delete one by mistake and undo it: the section only warns once the accordion has no header or panel left at all.
- **Keep headers short.** A visitor reads the headers to decide what to open; the detail belongs in the panel.
- **For a long FAQ,** let several open at once (turn **One open at a time** off), so people can compare answers.