Display UIBadge
A compact element used to display counts, labels, or statuses. Great for notifications, tags, or progress indicators.
Badge
Installation
Usage
API
Badge Props
For Badge Component
| Attribute | Type | Description | Default |
|---|---|---|---|
| variant | "primary" | "danger" | "success" | "warning" | Controls the visual style and color scheme of the badge. | "primary" |
| radius | "sm" | "md" | "lg" | "pill" | Controls the border radius of the badge. | "md" |
| className | string | Additional CSS classes to customize the badge styling. | - |
Examples
Default
BadgeBadgeBadgeBadgeBadge
Warning
BadgeBadgeBadgeBadgeBadge
Success
BadgeBadgeBadgeBadgeBadge
Danger
BadgeBadgeBadgeBadgeBadge
Credits
This component is inspired by Rehman Kalawant Design Shared On Github.