### Badges

Documentation and examples for badges, our small count and labeling component.

Badges on Bootstrap

##### Subtle badges

Primary Secondary Success Info Warning Danger Light Dark

    <span class="badge badge-subtle-primary">Primary</span>
    <span class="badge badge-subtle-secondary">Secondary</span>
    <span class="badge badge-subtle-success">Success</span>
    <span class="badge badge-subtle-info">Info</span>
    <span class="badge badge-subtle-warning">Warning</span>
    <span class="badge badge-subtle-danger">Danger</span>
    <span class="badge badge-subtle-light">Light</span>
    <span class="badge badge-subtle-dark">Dark</span>

##### Subtle pill badges

Primary Secondary Success Info Warning Danger Light Dark

    <span class="badge rounded-pill badge-subtle-primary">Primary</span>
    <span class="badge rounded-pill badge-subtle-secondary">Secondary</span>
    <span class="badge rounded-pill badge-subtle-success">Success</span>
    <span class="badge rounded-pill badge-subtle-info">Info</span>
    <span class="badge rounded-pill badge-subtle-warning">Warning</span>
    <span class="badge rounded-pill badge-subtle-danger">Danger</span>
    <span class="badge rounded-pill badge-subtle-light">Light</span>
    <span class="badge rounded-pill badge-subtle-dark">Dark</span>

##### Solid badges

Primary Secondary Success Info Warning Danger Light Dark

    <span class="badge bg-primary">Primary</span>
    <span class="badge bg-secondary">Secondary</span>
    <span class="badge bg-success">Success</span>
    <span class="badge bg-info">Info</span>
    <span class="badge bg-warning">Warning</span>
    <span class="badge bg-danger">Danger</span>
    <span class="badge bg-light text-dark">Light</span>
    <span class="badge bg-dark dark__bg-dark">Dark</span>

##### Solid pill badges

Primary Secondary Success Info Warning Danger Light Dark

    <span class="badge rounded-pill bg-primary">Primary</span>
    <span class="badge rounded-pill bg-secondary">Secondary</span>
    <span class="badge rounded-pill bg-success">Success</span>
    <span class="badge rounded-pill bg-info">Info</span>
    <span class="badge rounded-pill bg-warning">Warning</span>
    <span class="badge rounded-pill bg-danger">Danger</span>
    <span class="badge rounded-pill bg-light text-dark">Light</span>
    <span class="badge rounded-pill bg-dark dark__bg-dark">Dark</span>

#### Register

Please create your free Falcon account

Name
Email address
Password
Confirm Password
I accept the terms and privacy policy

or register with
google
facebook

##### Settings

Set your own customized style

##### Color Scheme

Choose the perfect color mode for your app.

##### RTL Mode

Switch your language direction

RTL Documentation

##### Fluid Layout

Toggle container layout system

Fluid Documentation

##### Navigation Position

Select a suitable navigation system for your web application

##### Vertical Navbar Style

Switch between styles for your vertical navbar

See Documentation

##### Like What You See?

Get Falcon now and create beautiful dashboards with hundreds of widgets.

Purchase
customize