Webflow Elements

Accordion

No items found.
Overview
Layout Elements
Layout Elements Overview
100
Section
101
Container
102
Grid
103
Columns
104
Basic Elements
Basic Elements Overview
200
Typography Elements
Typography Elements Overview
300
Text Block
301
Paragraph
302
Rich Text
306
Block Quote
306
Typography Elements
CMS Elements Overview
400
Users Elements
Users Elements Overview
500
Media Elements
Media Elements Overview
600
Background Video
601
Forms Elements
Forms Elements Overview
700
Advanced & Navigation Elements
Advanced Elements Overview
800
Code Block
801
Navigation Elements
Dropdown
803
Third-Party Elements
Third-Party Elements Overview
850
Table of Contents
851
Other Custom Elements
Accordion
901
Breadcrumbs
902
No items found.

An Accordion is a popular element in the same family as tabs. It allows you to present sections of content selectively, so that the user isn't confronted with too much information all at once.

Tabs generally have two variations; tabs on the top ( or bottom ) and tabs on the side ( left or right ).

Accordions similarly have two presentations variations - expanding vertically ( common ), or expanding horizontally ( less common ).

They also have behavioral variations;

  • View one panel at a time. Opening a new panel closes other open panels, like a tab only shows one at a time.
  • View multiple panels at a time. Each panel opens and closes independently of the others.
  • Partial opening ( rare ). Draggable to allow for a kind of reveal.

Implementations

Webflow's Tutorial

Other Cloneables

https://www.flowradar.com/cloneables/faq-accordion-webflow

https://webflow.com/made-in-webflow/website/FAQ-Accordian-or-Flowbase?gspk=anVzdGlucGhpbGxpcHM5OTUw&gsxid=dCsrNi7Oa875

Table of Contents
Did we just make your life better?
Passion drives our long hours and late nights supporting the Webflow community. Click the button to show your love.