Lists
Grouped content items with consistent styling and various layout options.
Standard List
Default Item
Standard padding and font sizes.
Another Item
Secondary information here.
Badge
Dense Variant
Compact padding and smaller typography for space-constrained areas.
Dense Item 1
Compact description.
Dense Item 2
Fits more items in less space.
<div class="list-group list-group--dense">...</div>Leading Icons & Avatars
Item with Icon
Visual cues help scanning.
John Doe
Project Manager
Item States
Selected Item
Highlighted state.
Disabled Item
Muted and non-interactive.
Static Item
No hover effect or pointer cursor.
Flush & No Dividers
Inside a container, with Borders and Dividers removed.
Flush Item 1
Flush Item 2
Text Lists (Bullets & Dashes)
Variants for simpler documentation-style lists.
Bullets
First bullet point
Second bullet point
Dashes
First dash item
Second dash item