Welcome UI - Badge

import { Badge } from 'welcome-ui/Badge'

const Example = () => {
  return (
    <>
      <Badge>{1}</Badge>
      <Badge variant="primary">New</Badge>
    </>
  )
}

export default Example

Examples

Sizes

Use size property with sm or md (default)

Variants

Use variant property with default (default) or primary

Disabled

Use disabled property

withNumberAbbreviation

If a number is higher than 99, we replace this number by 99+, simply add property withNumberAbbreviation. The children need to be a number!

Variant can be default (default) or primary