Badgesv5.x

---- Various colors & sizes --------
<div>
   <span class="badge bg-primary text-light fs-1">Primary</span>
   <span class="badge bg-info text-light fs-2">Info</span>
   <span class="badge bg-success text-light fs-3">Success</span>
   <span class="badge bg-dark text-light fs-4">Dark</span>
   <span class="badge bg-secondary text-light fs-5">Secondary</span>
   <span class="badge bg-light text-dark fs-6">Light</span>
</div>
---- Alternate colors --------
<div class="mb-4">
   <span class="badge bg-warning text-danger fs-5">Warning</span>
   <span class="badge bg-danger text-warning fs-5">Danger</span>
</div>
---- High-contrast text badges --------
<div class="mb-4">
   <span class="badge text-bg-primary">Primary</span>
   <span class="badge text-bg-info">Info</span>
   <span class="badge text-bg-success">Success</span>
   <span class="badge text-bg-warning">Warning</span>
   <span class="badge text-bg-danger">Danger</span>
   <span class="badge text-bg-dark">Dark</span>
   <span class="badge text-bg-secondary">Secondary</span>
   <span class="badge text-bg-light">Light</span>
</div>
---- Button w/ badge --------
<button type="button" class="btn btn-primary d-block mb-4">
   Button <span class="ms-3 badge text-bg-light">badge</span>
</button>
---- Button w/ positioned badge --------
<button type="button" class="btn btn-secondary position-relative me-4 mb-4 d-block">
   Tickets
   <span class="position-absolute top-0 start-100 translate-middle badge rounded-pill bg-danger">
      69
      <span class="visually-hidden">unread messages</span>
   </span>
</button>
---- Button w/ empty positioned badge --------
<button type="button" class="btn btn-primary position-relative d-block mb-4">
   Account
   <span class="position-absolute top-0 start-100 translate-middle p-2 bg-danger border border-light rounded-circle">
      <span class="visually-hidden">changes made to account</span>
   </span>
</button>