Accordion

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

Yes. All components are compatible with Django.

Yes. It comes with default styles that match the other components in this library.

Yes. It's animated by default, but you can disable it if you prefer.

Installation

uvx shadcn_django@latest add accordion

Usage

<c-accordion type='single' collapsible='true'>
    <c-accordion.item value='item-1'>
        <c-accordion.trigger value='item-1'>Is it for Django?</c-accordion.trigger>
        <c-accordion.content value='item-1'>
            Yes. All components are compatible with Django.
        </c-accordion.content>
    </c-accordion.item>
</c-accordion>