Components
Base Badge
A customizable badge component built with Base UI and useRender hook for composition.
Loading
Installation
pnpm dlx shadcn@latest add @reui/base-badge
Examples
Outline
Loading
Light
Loading
Ghost
Loading
Disabled
Loading
Size
Loading
Circle
Loading
Square
Loading
With Icon
Loading
With Dot
Loading
Remove Button
Loading
Render Prop
Loading
API Reference
This component supports both Base UI's useRender hook pattern and traditional asChild prop for backward compatibility.
Badge
| Prop | Type | Default |
|---|---|---|
render | <span /> | |
asChild | false | |
variant | primary | |
appearance | default | |
size | md | |
shape | default | |
disabled | false |
BadgeButton
| Prop | Type | Default |
|---|---|---|
render | <button /> | |
asChild | false |
BadgeDot
This is a simple span element with no additional props beyond standard HTML attributes.