Examples
Example heading New
Example heading New
Example heading New
Example heading New
Example heading New
Example heading New
<div class="h1">Example heading
    <span class="badge badge-secondary">New</span>
</div>
<div class="h2">Example heading
    <span class="badge badge-secondary">New</span>
</div>
<div class="h3">Example heading
    <span class="badge badge-secondary">New</span>
</div>
<div class="h4">Example heading
    <span class="badge badge-secondary">New</span>
</div>
<div class="h5">Example heading
    <span class="badge badge-secondary">New</span>
</div>
<div class="h6">Example heading
    <span class="badge badge-secondary">New</span>
</div>
Part of links or buttons
<button class="btn">
    Notifications
    <span class="badge badge-secondary">4</span>
</button>
<button class="btn">
    Profile
    <span class="badge badge-secondary">9</span>
    <span class="sr-only">unread messages</span>
</button>
Contextual variations
DANGER DARK INFO LIGHT PRIMARY SECONDARY SUCCESS WARNING

<span class="badge badge-danger">DANGER</span>

<span class="badge badge-dark">DARK</span>

<span class="badge badge-info">INFO</span>

<span class="badge badge-light">LIGHT</span>

<span class="badge badge-primary">PRIMARY</span>

<span class="badge badge-secondary">SECONDARY</span>

<span class="badge badge-success">SUCCESS</span>

<span class="badge badge-warning">WARNING</span>
Pill badges
DANGER DARK INFO LIGHT PRIMARY SECONDARY SUCCESS WARNING

<span class="badge badge-pill badge-danger">DANGER</span>

<span class="badge badge-pill badge-dark">DARK</span>

<span class="badge badge-pill badge-info">INFO</span>

<span class="badge badge-pill badge-light">LIGHT</span>

<span class="badge badge-pill badge-primary">PRIMARY</span>

<span class="badge badge-pill badge-secondary">SECONDARY</span>

<span class="badge badge-pill badge-success">SUCCESS</span>

<span class="badge badge-pill badge-warning">WARNING</span>
Links

<a href="#" class="badge badge-danger">DANGER</a>

<a href="#" class="badge badge-dark">DARK</a>

<a href="#" class="badge badge-info">INFO</a>

<a href="#" class="badge badge-light">LIGHT</a>

<a href="#" class="badge badge-primary">PRIMARY</a>

<a href="#" class="badge badge-secondary">SECONDARY</a>

<a href="#" class="badge badge-success">SUCCESS</a>

<a href="#" class="badge badge-warning">WARNING</a>
TODAY
Saturday
1 th Jan
Events

Group Meeting

In 32 Minutes, Room 1B

Public Beta Release

11:00 PM

Dinner with David

17:30 PM

Q&A Session

20:30 PM

Notes

Best songs to listen while working

Last edit: May 8th, 2015

Useful subreddits

Last edit: January 12th, 2015

Quick Settings

Notifications

Cloud Sync

Retro Thrusters