Bootstrap badges like on shields.io

bootstrap-shields-badges.html

<!-- Create badges / shields like on shields.io
  -- but with bootstrap.
  --
  -- Fully adjustable, use this for whatever you want ^^
  --
  -- Finn M Glas, 2020-07-06
  -->

<!-- Regular badges (value-only) -->

<span class="badge text-white p-0"><span class="py-1 px-2 rounded" style="background:#007bff">value</span></span>

<!---->

<br>
<br>

<!-- Key-value-color badges -->

<span class="badge text-white p-0 m-1"><span class="bg-secondary py-1 px-2 rounded-left">key</span><span class="py-1 px-2 rounded-right" style="background:#007bff;">value</span></span>

<!---->

These badges look amazing ^^

The major advantage of bootstrap badges over shields badges: less requests and dependencies, less loading time.

---

@twbs I believe, this should be included somewhere on the https://getbootstrap.com page, as it is very useful.