Badge

NbBadge is a compact label used to highlight status, category, or a short value. It supports multiple color variants, two sizes, and an optional dot indicator.

<template>
  <NbBadge variant="blue">badge</NbBadge>
</template>

Variants ​

Use variant to communicate meaning through color.

Sizes ​

Dot mode ​

Add dot to prepend a status indicator before the label.

<template>
  <NbBadge variant="green" dot>active</NbBadge>
</template>

Props ​

Variant values ​

Slots ​