#### Secondary Pill Badges

Use the `.badge` class, followed by`.badge-pill` with `.badge-secondary`class within element to create default pill badge.

Secondary

#### Primary Pill Badges

Use the `.badge` class, followed by`.badge-pill` with `.badge-primary`class within element to create primary pill badge.

Primary

#### Success Pill Badges

Use the `.badge` class, followed by`.badge-pill` with `.badge-success`class within element to create success pill badge.

Success

#### Danger Pill Badges

Use the `.badge` class, followed by `.badge-pill` with `.badge-danger`class within element to create danger pill badge.

Danger

#### Info Pill Badges

Use the `.badge` class, followed by `.badge-pill` with `.badge-info`class within element to create info pill badge.

Info

#### Warning Pill Badges

Use the `.badge` class, followed by `.badge-pill` with `.badge-warning`class within element to create warning pill badge.

Warning

#### Glow Badges

Use class `.badge-glow` to add glow effect to your badge

Primary
Success
Danger
Info
Warning

#### Badge Pills With Icons

#### Pill Badges as Notification

Use `.badge-up` to set pill badge to higher than other text. So that it can work with notifications also.

#### Icon Pill with Color Variations

4
5
6

#### Badge Pill Link

Use class `.badge.badge-pill` with `<a>` tag to make your badge a link

Primary

#### Badge Pill Dropup

wrap your `.badge` with `.dropup` to make your badge a dropup

#### Block Badge Pill

use `.block` with `.badge-pill` to display your badge as block level element

Block Badge Pill

#### Badge Pill Sizes

Use classes `badge-{xl|lg|md|sm}` to change size of a badge

Extra Large
Large
Medium
Small