Single Expansion

An accordion is a vertically stacked set of interactive headings that each reveal a section of content.

Use accordions when you need to organize content into collapsible sections.

Accordions must be keyboard accessible and properly announce their expanded/collapsed state to screen readers.

Multiple Expansion

Content for section one. With allowMultiple enabled, multiple sections can be open.

Content for section two.

Content for section three.

With Disabled Items

This section can be expanded and collapsed normally.

This content is not accessible because the section is disabled.

This section can also be expanded.