Skip to Main Content

Pelican Design System icon Pelican Design System Collapse

Collapse

Collapses allow users to toggle the visibility of content.

Best Practices

  • Collapses give users control over how much information they see at one time.
  • A common use of Collapses is for a “Question and Answer” item on a FAQ page.
  • Use the native HTML tag for Details disclosure Element as Collapses whenever possible.

Usage

See the Pen Cards by LA Gov Design Team (@lagovdesignteam) on CodePen.

Resources

Page top