Accordions

16 snippets

Welcome to the Accordions resource page — a curated directory for developers. Browse practical UI patterns, specialized libraries, and small interactive demos. Use the table of contents to explore subcategories below.

javascript-accordions

Snippets(16)

Accessible Collapsible Content Accordion
A accessible collapsible content accordion built with modern frontend techniques for responsive and reusable UI.
Frontend Ui Modern Design Web Components
Demo Code
Technologies
HTML, CSS, JavaScript
Difficulty
Beginner
Browser support
Chrome 5+, Edge 12+, Firefox 4+, Safari 5+
Features
ARIA Attributes, Focus Management, Internal Close Button, SVG Icon Toggle
Accordion FAQ Menu
A accordion faq menu built with modern frontend techniques for responsive and reusable UI.
Menu Ui Navbar Frontend Ui Modern Design+1 more
Demo Code
Accordion Slider with Vanilla JS
A accordion slider with vanilla js built with modern frontend techniques for responsive and reusable UI.
Content Slider Carousel Frontend Ui Modern Design+1 more
Demo Code
Animated Hover Disclosures
A animated hover disclosures built with modern frontend techniques for responsive and reusable UI.
Frontend Ui Modern Design Web Components
Demo Code
Collection Grid Accordion
A collection grid accordion built with modern frontend techniques for responsive and reusable UI.
Frontend Ui Modern Design Web Components
Demo Code
Fluid Morphing List Expansion
A fluid morphing list expansion built with modern frontend techniques for responsive and reusable UI.
Frontend Ui Modern Design Web Components
Demo Code
Technologies
HTML, CSS, JavaScript
Difficulty
Advanced
Browser support
Chrome 60+, Edge 79+, Firefox 60+, Safari 11+
Features
Layout Morphing, FLIP Animation, State Management, Flexbox Transition
List Click on Expand N1
A list click on expand n1 built with modern frontend techniques for responsive and reusable UI.
Frontend Ui Modern Design Web Components
Demo Code
Nested Accordion FAQs
A nested accordion faqs built with modern frontend techniques for responsive and reusable UI.
Frontend Ui Modern Design Web Components
Demo Code
Smooth Scroll Stacking Accordion
A smooth scroll stacking accordion built with modern frontend techniques for responsive and reusable UI.
Frontend Ui Modern Design Web Components
Demo Code
Technologies
HTML, SCSS, Babel
Difficulty
Intermediate
Browser support
Chrome 79+, Edge 79+, Firefox 75+, Safari 11.1+
Features
Scroll Animation, Card Stacking, Pinned Section
Center-Mode Productivity Slider (Pro v5)
A center-mode productivity slider (pro v5) built with modern frontend techniques for responsive and reusable UI.
Content Slider Carousel Frontend Ui Modern Design+1 more
Demo Code
FAQ Accordion with Font Awesome Icons
A faq accordion with font awesome icons built with modern frontend techniques for responsive and reusable UI.
Frontend Ui Modern Design Web Components
Demo Code
Expanding Cards
A expanding cards built with modern frontend techniques for responsive and reusable UI.
Frontend Ui Modern Design Content Card Card Component+1 more
Demo Code
FAQ Accordion
A faq accordion built with modern frontend techniques for responsive and reusable UI.
Frontend Ui Modern Design Web Components
Demo Code
Simple Image Accordion
A simple image accordion built with modern frontend techniques for responsive and reusable UI.
Frontend Ui Modern Design Web Components
Demo Code
Expanding Flexbox Panels
A expanding flexbox panels built with modern frontend techniques for responsive and reusable UI.
Semantic Html Html Frontend Ui Modern Design+2 more
Demo Code
Technologies
HTML, CSS, JavaScript
Features
Flexbox Animation, Blur Filter Effect, Vanilla JS
Responsive
Yes
Slot Picker Interaction with View Transitions
A slot picker interaction with view transitions built with modern frontend techniques for responsive and reusable UI.
Semantic Html Html Frontend Ui Modern Design+1 more
Demo Code
Technologies
View Transition API, CSS, HTML
Difficulty
intermediate
Features
Layout Morphing, Animated Transitions, Time Scheduling
Responsive
Yes

Snippets(16)

related hubs