Badges

  1. Home
  2. UI
  3. Badges

Basic

Default Primary Success Info Warning Danger Pink Purple Brown Cyan
Default .badges with color

Pill

Default Primary Success 16 8 +19 -9 -19
.badge-pill applies to .badge.

More colors

Purple Pink Cyan Yellow brown Dark Grey Secondary
.badge-* which * is one of the following color names.

Sizing

Extra large Large Medium Small
Available sizes are sm, lg, xl

Dot badges




.badge-dot applies to .badge.

Ring badges






.fill can applies to .badge-ring

.badge-ring applies to .badge.