- ###### Files

- Two new item submitted

  Marketing Manager
  '17kb

- 52 JPG file Generated

  FontEnd Developer
  '11kb

- 25 PDF File Uploaded

  Digital Marketing Manager
  '150kb

- Anna_Strong

  Web Designer
  '256kb

- ###### Members

- John Doe

  UI designer

- Michal Clark

  FontEnd Developer

- Milena Gibson

  Digital Marketing Manager

- Anna Strong

  Web Designer

- No results found.

#### 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

#### Light Badges

Use class `.badge-pill` class with `.badge.badge-light-{colorName}` to add light 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