Badge

Inline badge for labels, counts, and status indicators.

Basic usage

Default

<span class="kit-badge">Default</span>

Semantic colors

PrimarySecondarySuccessWarningDangerInfo

<span class="kit-badge -primary">Primary</span>
<span class="kit-badge -secondary">Secondary</span>
<span class="kit-badge -success">Success</span>
<span class="kit-badge -warning">Warning</span>
<span class="kit-badge -danger">Danger</span>
<span class="kit-badge -info">Info</span>

Named colors

OrangeDodgerblueDeeppinkLimegreenCrimsonGreenSilverBlack

<span class="kit-badge -orange">Orange</span>
<span class="kit-badge -dodgerblue">Dodgerblue</span>
<span class="kit-badge -deeppink">Deeppink</span>
<span class="kit-badge -limegreen">Limegreen</span>
<span class="kit-badge -crimson">Crimson</span>
<span class="kit-badge -green">Green</span>
<span class="kit-badge -silver">Silver</span>
<span class="kit-badge -black">Black</span>