ComponentClient component
Accordion
Vertically stacked disclosure sections with fluid, accessible motion.
Installation
Preview
Every component is installed directly into your project, so you can reshape every detail.
Usage
tsx
import {
Accordion,
AccordionContent,
AccordionItem,
AccordionTrigger,
} from "@/components/ui/accordion"
<Accordion collapsible type="single">
<AccordionItem value="item-1">
<AccordionTrigger>Is the source editable?</AccordionTrigger>
<AccordionContent>Every detail is yours to change.</AccordionContent>
</AccordionItem>
</Accordion>API reference
| Prop | Type | Default | Description |
|---|---|---|---|
type | "single" | "multiple" | — | Controls whether one or several items can be open. |
collapsible | boolean | false | Allows the active single item to be closed. |
className | string | — | Overrides or extends the generated Tailwind classes. |
disabled | boolean | false | Prevents user interaction when supported. |