Accordion

Accordion is used to display and hide related content in collapsible panels. Users can click on the title to expand or collapse the content area.

Tailsee offers many style variations of the Accordion, including bordered, with icon, content bordered, full width, etc., all featuring smooth open and close animations. Additionally, there are functional scenarios such as multi-level Accordions, single content item open, and multiple content items open.

Basic

With Separator

An accordion component with separators between sections for clear content division.

With Button

An accordion component with call-to-action buttons that guide users to click and interact with the content.

Rounded Style

An accordion component with rounded corners for a softer visual appearance.

With Icon

An accordion component with icon indicators showing the question type for each trigger button.

Animation

Spring Enter Animation

An accordion component using spring animation for natural, elastic transitions.

EaseInOut Enter Animation

An accordion component with smooth ease-in-out animation for enter and exit.

Scene

Multi Open

An accordion component allowing multiple items to be expanded simultaneously.