Basic Pill Badges

Use the .badge-pill modifier class to make badges more rounded (with a larger border-radius and additional horizontal padding).

Primary
Secondary
Success
Info
Warning
Danger

Pill Badges Light

Use the .badge-pill class with .badge.badge-light-{colorName} class to create pill badges with light colored background options.

Primary
Secondary
Success
Info
Warning
Danger

Glow Badges

Use class .badge-glow to add glow effect with badges.

Primary
Secondary
Success
Info
Warning
Danger

Pill Badges With Icons

Primary
Secondary
Success
Danger
Info
Warning

Pill Badges as Notification

Use class .badge-up within .position-relative class to add badges as notification.

4
5
6

Custom Badge Circle

Use .badge-circle to add badges with circle and use .badge-circle-{colorName} to create circle badges with colored background options. For different sizing variations, use .badge-circle-{lg/sm} along with .badge-circle.

Custom Badge Circle with Light Background

Use .badge-circle-light-{colorName} along with .badge-circle class to create circle badges with light colored background options.

today

How can we help? 😄

7:45 AM

Hey John, I am looking for the best admin template.

Could you please help me to find it out? 🤔

7:50 AM

Stack admin is the responsive bootstrap 4 admin template.

8:01 AM