Quirk Design System & UI Kit - Accordion

My Quirk Pack contains only premium components.

In this standalone version, you will get all the design system styles, including:

• Color styles
• Typography styles
• Shadow, Elevation, and Focus styles
• Border, Padding, Spacings, and Sizes variables.

The Accordion component has the following variants:

• Sizes (LG, MD, SM, XS)
• Status (Opened, Closed)
• Background (None, Subtle, Primary)
• State (Default, Disabled)
• Round (None, Subtle)
• Border (None, Subtle, Default)
• Show icon (True, False)
• Icon (Change the displayed icon)
• Title (Text property, changes the title)
• Body (Text property, changes the description)

All styles, sizes, colors, and variants can be customized from the Local Styles and Local Variables sections.

Thanks to all the customization capabilities, this component will allow you to integrate it with other components easily.