Patterns · Record pages / Collapsible sections
Collapsible sections
Long records in sections that open and close, with tabs that follow the scroll.
How it works
SectionSectionSection
Sectioneditexpand_less
Hint text
Hint text
Sectionexpand_more
Sectionexpand_more
Tapping a tab opens its section and scrolls to it; the active tab follows the scroll.
Rules
- Several sections can be open at once.
- Tab names match section names exactly.
- A section with an error opens itself and scrolls into view on Submit.
Motion and haptics
| Moment | Motion | Haptic |
|---|---|---|
| Section opens | Height grows 180 ms; chevron turns | — |
Seen in
NecropsyMedicalEggFamily tree
Built from the Antz modules on the Design Links hub, 26 Oct 2026. Not drawn in Figma yet: treat it as a temporary rule.