🎉 Black Friday deal! 25% off your first year of CodyHouse Pro →


Progress value is 30%


The accordion creates stacked sections of content and allows the user to expand/collapse them.

Copy: View demo


All components are built upon the CodyHouse Framework.

This component includes variations. All variations share the same SCSS/JS code. They only differ in the HTML part.

How to

The accordion component is used to condense related content sections by enabling the user to expand/collapse them. In other words, it's used to save space and group together related content.

You can edit the following data attributes to affect the component behavior:

  • data-animation: animate height of the content items when expanding/collapsing them; value 'on'/'off'; default value = off.
  • data-multi-items: allow multiple accordion items to be open at the same time; value 'on'/'off'; default value = 'on'.

✅ Project duplicated

✅ Project created

There was an error while trying to export your project. Please try again or contact us