Badges

Use badges for displaying a small amount of information, such as the number of notifications or new content.

Use a primary colored badge for the most part. If you want to inform about something successful use success and if you want to inform about something that failed or has an negative impact use danger.

Use secondary if you want to inform about something generic without seeking a lot of attention.

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

<span class="badge badge-success">Offert signerad</span>

<span class="badge badge-danger">Offert nekad</span>

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

<ul class="list-group" style="max-width: 250px">
  <li class="list-group-item">Notifikationer <span class="badge badge-primary">33</span></a></li>
  <li class="list-group-item">Inställningar</li>
  <li class="list-group-item">Användare</li>
</ul>

Nyhet

Offert signerad

Offert nekad

Avprenumererad