Bootstrap 5 Badges

Append and highlight additional information to a string of text with a stylized badge.

Bootstrap's badge classes can be used to highlight additional information that's appended to a string of text.

To create a badge, apply the .badge class, as well as one of the .bg-* contextual classes to the <span> element that represents the badge.

Example

Here we create a default badge by using class="badge badge-primary".

Try it

Contextual Classes

The following contextual classes are available for badges.

Try it

Pill Badges

Make the corners more rounded with Bootstrap's .badge-pill class.

Try it