Lists

List groups are a flexible and powerful component for displaying a series of content. Modify and extend them to support just about any content within.

Unstyled

Remove the default list-style and left margin on list items (immediate children only). This only applies to immediate children list items, meaning you will need to add the class for any nested lists as well.

Unstyled spacings

You can add vertical spacings between lists with modifier classes.

Use .list-unstyled-py-2 class.

Use .list-unstyled-py-3 class.

Use .list-unstyled-py-4 class.

Inline

Remove a list's bullets and apply some light margin with a combination of two classes, .list-inline and .list-inline-item.

Inline Spacings

Use .list-inline-m-1 class to add margin: .25rem; around the .list-inline-item.

List separator

Use .list-separator class with the .list-inline class for an inline separator with a circled shape.

List comment

Use .list-comment class and .list-comment-item as a child class for a comment style listing.

List checked

Replacing the default list-style and left margin on list items with 3 different styles of checkboxes.

List checked Sizings

Use .list-checked-sm class.

Use .list-checked-lg class.

Color variations