Beta

Accordion

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

We take the Shadcn UI component and animate it with Motion.

Installation

Props

Animate UI props

AccordionTrigger

PropTypeDefault
transition?
Transition
{ type: 'spring', stiffness: 150, damping: 17 }

AccordionContent

PropTypeDefault
transition?
Transition
{ type: 'spring', stiffness: 150, damping: 17 }

Credits

  • We use Radix UI for the accordion component.
  • We take our inspiration from Shadcn UI for the accordion style (to make it easier to replace a shadcn component with the animate ui component).

On this page