Bootstrap 5 Badges

Badges are used to add additional information to any content:

Example

Example heading New
Example heading New
Example heading New
Example heading New
Example heading New
Example heading New

Examples

<h1>Example heading New</span></h1>
<h2>Example heading New</span></h2>
<h3>Example heading New</span></h3>
<h4>Example heading New</span></h4>
<h5>Example heading New</span></h5>
<h6>Example heading New</span></h6>
<h6>Example heading New</span></h6>

In this example:

The <span> class="badge badge-primary badge-pill">5</span> element represents a badge with the Bootstrap classes for primary color (badge-primary) and a pill shape (badge-pill).

The badge is placed inside a list item (<li>) to show how it can be used in a typical context, such as a product list.