Badge

A small component used to highlight status, labels, or counts.

Usage

Import the Badge component from @bun-ui/react:

import { Badge } from "@bun-ui/react"

Examples

Colors

The Badge component supports different colors to indicate various states or categories.

Sizes

The Badge component comes in three sizes to fit different contexts.

Variant

Customization

The Badge component can be customized using the className prop or by extending its styles with your design system.

<Badge className="bg-gradient-to-r from-purple-500 to-pink-500">
  Custom Badge
</Badge>

Refer to the source code for more advanced usage and customization options.