Accordion

A vertically stacked set of interactive headings that each reveal a section of content.

Basic Usage

A simple accordion that allows one section to be open at a time, with the ability to collapse the open section.

A UI Library is a collection of reusable components that help you build user interfaces consistently and efficiently.

Multiple Sections Open

An accordion that allows multiple sections to be open simultaneously.

Props

Prop
Type
Default
Description
itemsRequired
Array<{ title: string, content: ReactNode }>
—

Array of objects containing title and content for each accordion item

type
'single' | 'multiple'
—

Whether one or multiple items can be opened at once

collapsible
boolean
—

Whether the opened items can be collapsed

defaultValue
string
—

The default open item value(s)

className
string
—

Additional CSS classes to apply to the accordion