Grouped Collapsible
Several collapsible panels stacked together so readers open one section at a time. Good for settings pages where related options sit in separate groups.
Several collapsible panels stacked together so readers open one section at a time. Good for settings pages where related options sit in separate groups.
Search blocks by description or jump to a page.
Grouped Collapsible stacks three collapsible panels inside a single bordered container. Each panel has a full-width trigger row with a bold label on the left and a chevron icon on the right that flips between up and down as the section opens or closes. Below the trigger, a ruled content area holds a short paragraph. All three panels are independent: opening one does not close the others.
The sections, their labels, and their body text are all free to change. You can add more panels or remove one entirely without affecting the rest. The container and divider lines are structural, so the visual grouping stays intact no matter how many sections you keep.
This layout fits any page where related but distinct pieces of information need to coexist without overwhelming the reader at first glance. For a creative agency or studio, it works well on a services or process page where clients can expand pricing details, project scope, or revision policies one at a time. It is a better fit than a full accordion when the sections are truly independent and readers may want more than one open simultaneously.
A natural flow around it on a Components page:
Before
After
Each section is self-contained, so you can tailor the block to your content without structural changes:
Tip: keep each body paragraph to two or three sentences so the panel feels purposeful when open rather than like a wall of text.