Badge - Raven

Basic

Primary Danger Warning Success Secondary Dark


<span class="badge badge-primary">primary</span>
<span class="badge badge-danger">danger</span>
<span class="badge badge-warning">warning</span>
<span class="badge badge-success">success</span>
<span class="badge badge-secondary">secondary</span>
<span class="badge badge-dark">dark</span>

Size

Small Normal Large


<span class="badge badge-sm badge-primary">small</span>
<span class="badge badge-primary">normal</span>
<span class="badge badge-lg badge-primary">large</span>

Inside Button


<button type="button" class="btn btn-primary">
    primary
    <span class="badge badge-sm badge-secondary ml-1">5</span>
</button>
<button type="button" class="btn btn-outline-primary">
    primary
    <span class="badge badge-sm badge-danger ml-1">5</span>
</button>