Skip to main content

Home Page Patterns Accordion

Accordion

Expandable panels that reveal content when their header is clicked.

An accordion is a vertical list of section headers. Click a header and the section expands to reveal its content; click it again to collapse. Some accordions let one section open at a time; others allow many.

Accordions save space when content is long but only some sections are relevant to a given user. Avoid hiding critical information — if every visitor needs it, do not make them click to find it.

Related terms