Badge

Badges are used to highlight important information.

badge
'use client'
import { Badge } from '@nerdfish/ui'
export function BadgeExample() {
return <Badge>badge</Badge>
}

Usage

import { Badge } from '@nerdfish/ui'
<Badge>Badge</Badge>

Examples

Default

badge
'use client'
import { Badge } from '@nerdfish/ui'
export function BadgeExample() {
return <Badge>badge</Badge>
}

Secondary

badge
'use client'
import { Badge } from '@nerdfish/ui'
export function BadgeSecondaryExample() {
return <Badge variant="secondary">badge</Badge>
}

Danger

badge
'use client'
import { Badge } from '@nerdfish/ui'
export function BadgeDangerExample() {
return <Badge variant="danger">badge</Badge>
}

Outline

badge
'use client'
import { Badge } from '@nerdfish/ui'
export function BadgeOutlineExample() {
return <Badge variant="outline">badge</Badge>
}

Success

badge
'use client'
import { Badge } from '@nerdfish/ui'
export function BadgeSuccessExample() {
return <Badge variant="success">badge</Badge>
}