Collapsible

An interactive component which expands/collapses a panel.

Made by imskyleen
Edit on GitHub
Open in

Installation

Usage

<Collapsible>
  <CollapsibleTrigger>Collapsible Trigger</CollapsibleTrigger>
  <CollapsibleContent>
    <div>Collapsible Content</div>
  </CollapsibleContent>
</Collapsible>

API Reference

Collapsible

Radix UI API Reference - Collapsible.Root

CollapsibleTrigger

Radix UI API Reference - Collapsible.Trigger

CollapsibleContent

Radix UI API Reference - Collapsible.Content
PropTypeDefault
transition?
Transition
{ type: 'spring', stiffness: 150, damping: 22 }
keepRendered?
boolean
false
...props?
HTMLMotionProps<"div">
-

The asChild and forceMount props are not supported in the CollapsibleContent component as it is used for animation.

Credits

Built by Skyleen. The source code is available on GitHub.

Last updated: 10/4/2025