Skip to content

List group

List groups are responsive components for organizing and displaying a series of content.

Usage

Optimized for single-column layouts, it provides a simple and flexible way to display data. It follows the same styling as the data table but with a more lightweight implementation for basic data needs.

The List Group is flexible and can contain various types of content, such as badges, circle status, checkboxes or other interactive elements.

List group

When to use

  • When displaying straightforward, single-column data.
  • For lists where the data doesn't require complex structures, such as headers or multiple columns.
  • When a simpler alternative to a table is needed for performance or ease of use.

Best practices

  • Keep list items concise and clear.
  • Ensure the lists are readable and functional on all screen sizes.
  • Place it in cards, modals, side panel or other any other layout container.

Except where otherwise noted, content on this site is licensed under MIT License.