## Badge

#### Basic Badge

Badges scale to match the size of the immediate parent element by using relative font sizing

# Example heading New

#### Contextual variations

Add any of the below mentioned modifier classes to change the appearance of a badge.

Default Primary Secondary Success Danger Warning Info

#### Pill badges

Use the `.badge-pill` modifier class to make badges more rounded (with a larger `border-radius` and additional horizontal `padding`). Useful if you miss the badges from v3.

Default Primary Secondary Success Danger Warning Info

#### Two Tone Badge

We preset a series of colorful badge style for different situation usage.

magenta red volcano orange gold lime green cyan blue geekblue purple

#### Links

Using the contextual `.badge-*` classes on an `<a>` element quickly provide actionable badges with hover and focus states.

Primary Secondary Success Danger Warning Info

##### Search

##### Files

Quater Report.exl

by Finance

Documentaion.docx

by Developers

Recipe.txt

by The Chef

Project Requirement.pdf

by Project Manager

##### Members

Erin Gonzales

UI/UX Designer

Darryl Day

Software Engineer

Marshall Nichols

Data Analyst

##### News

5 Best Handwriting Fonts

25 Nov 2018

##### Theme Config

##### Header Color

Config header background color

##### Side Nav Dark

Change Side Nav to dark

##### Folded Menu

Toggle Folded Menu