Lists
Setting the list style type
To create bulleted or numeric lists, use the .list-disc and .list-decimal utilities.
- Now this is a story all about how, my life got flipped turned upside down
- And I like to take a minute and sit right here
- I'll tell you how I became the prince of a town called Bel-Air
- Now this is a story all about how, my life got flipped turned upside down
- And I like to take a minute and sit right here
- I'll tell you how I became the prince of a town called Bel-Air
- Now this is a story all about how, my life got flipped turned upside down
- And I like to take a minute and sit right here
- I'll tell you how I became the prince of a town called Bel-Air
Separator
A basic form of the inline list with dotted separator.
- FAQ
- License
- Terms & Conditions
Checked style
Replacing the default list style check style icons.
- FAQ
- License
- Terms & Conditions
- FAQ
- License
- Terms & Conditions
- FAQ
- License
- Terms & Conditions
List checked color variations
Predefined list checked color styles.
- Dark
- Gray
- Red
- Yellow
- Green
- Blue
- Indigo
- Purple
- Pink
- Light
- Dark
- Gray
- Red
- Yellow
- Green
- Blue
- Indigo
- Purple
- Pink
- Light
- Dark
- Gray
- Red
- Yellow
- Green
- Blue
- Indigo
- Purple
- Pink
- Light
Example
The most basic list group is an unordered list with list items.
- Profile
- Settings
- Newsletter
Icons
The default list group with icons.
- Newsletter
- Downloads
- Team Account
Links
Use a to create actionable list group items with hover, disabled, and active states.
Buttons
Use button to create actionable list group items with hover, disabled, and active states.
Striped
Zebra-striping list items.
- Profile
- Settings
- Newsletter
- Downloads
- Team Account
Flush
Remove some borders and rounded corners to render list group items edge-to-edge in a parent container (e.g., cards).
- Profile
- Settings
- Newsletter
No gutters
No paddings in left and right.
- Profile
- Settings
- Newsletter
Badges
Add badges to any list group item to show unread counts, activity, and more.
-
Profile New
-
Settings 2
-
Newsletter 99+
Horizontal
The default horizontal list group.
- Newsletter
- Downloads
- Team Account