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.


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

Contextual Classes

The following contextual classes are available for badges.

Pill Badges

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