Badges
Use
.badge class to get badge. For Primary, colored badge use
.badge-primary class.
Use
.badge class to get badge. For Secondary, colored badge use
.badge-secondary class.
Use
.badge class to get badge. For Success, colored badge use
.badge-success class.
Use
.badge class to get badge. For Danger, colored badge use
.badge-danger class.
Use
.badge class to get badge. For Info, colored badge use
.badge-info class.
Use
.badge class to get badge. For Warning, colored badge use
.badge-warning class.
Use
.badge class to get badge. For Light, colored badge use
.badge-light class.
Use
.badge class to get badge. For Dark, colored badge use
.badge-dark class.
Badge With Components
Easily highlight new or unread items by adding a
<span class="badge"> to links, Bootstrap navs, and more.
Use badge class in anchor tag for badge with link.
Use badge class in button tag for badge with button.
Built-in styles are included for placing badges in active states in pill navigations.
Pill Badges
Use
.badge-pill class to get badge pill. For Primary, colored badge use
.badge-primary class.
Use
.badge-pill class to get badge pill. For Secondary, colored badge use
.badge-secondary class.
Use
.badge-pill class to get badge pill. For Success, colored badge use
.badge-success class.
Use
.badge-pill class to get badge pill. For Danger, colored badge use
.badge-danger class.
Use
.badge-pill class to get badge pill. For Info, colored badge use
.badge-info class.
Use
.badge-pill class to get badge pill. For Warning, colored badge use
.badge-warning class.
Use
.badge-pill class to get badge pill. For Light, colored badge use
.badge-light class.
Use
.badge-pill class to get badge pill. For Dark, colored badge use
.badge-dark class.