Accordion

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

Variant

Installation

If you set type to multiple then accordion will allow multiple items to expend the same time

Variant

If you use disabled prop to AccordionItem then that item will disabled

Variant

Change icon attribute in AccordionTrigger to change icon for specific trigger

Variant

If you use value and onValueChange attribute to Accordion then it will control item states

Variant

Prop	Type	Default
variant	`underline` `outline` `soft`	underline

Prop	Type	Default
icon	ReactNode	`<ChevronDownIcon />`

Dark mode

Alert

On this page

Join us