Accordion


Create focused content with the Accordion Design Element. Organize content into parts that expand to display additional information. This is great when you have lengthy content or too many details that can overwhelm your page.








Accordion Options Demos


Default View



Accordion 1
Accordion 2
Accordion 3

Without Dividers


Accordion 1
Accordion 2
Accordion 3

Icon Location


Accordion 1
Accordion 2
Accordion 3

Different Colors


Success Color


Accordion 1
Accordion 2
Accordion 3

Danger Color


Accordion 1
Accordion 2
Accordion 3

Custom Icons


Accordion 1
Accordion 2
Accordion 3

Options Description

Title – required! Accordion item title
No divider – divider will not be used to as separator between accordions
Icon Location – place where you will see open and close icons:
  • Left – icon location will be on the left (Useful in RTL sites)
  • Right – icon location will be on the right
Color the active accordion color and hover style. All ShortPoint Colors are supported
Open Icon – change the default open icon. All ShortPoint Icons are supported  
Close Icon – change the default close icon. All ShortPoint Icons are supported