#Badge

<Badge content="New" />

<div>
  Text <Badge content="Info" variant="information" /> Text
</div>

<Badge content="Ny" variant="information">
  <Avatar.Group label="Persons:">
    <Avatar size="large" variant="secondary">
      A
    </Avatar>
  </Avatar.Group>
</Badge>

<Badge content={1} label="Notifications:" variant="notification" />

<div>
  Text <Badge content={1} label="Notifications:" variant="notification" />{' '}
  Text
</div>

<Badge content={1} label="Notifications:" variant="notification">
  <Avatar.Group label="Persons:">
    <Avatar size="large">A</Avatar>
  </Avatar.Group>
</Badge>

<Badge
  content={66}
  label="Notifications:"
  vertical="top"
  horizontal="left"
  variant="notification"
>
  <Avatar.Group label="Persons:">
    <Avatar size="large">A</Avatar>
  </Avatar.Group>
</Badge>

<Badge
  content={1}
  label="Notifications:"
  vertical="top"
  horizontal="right"
  variant="notification"
>
  <Avatar.Group label="Persons:">
    <Avatar size="large">A</Avatar>
  </Avatar.Group>
</Badge>

<Badge
  content={13}
  label="Notifications:"
  vertical="bottom"
  horizontal="left"
  variant="notification"
>
  <Avatar.Group label="Persons:">
    <Avatar size="large">A</Avatar>
  </Avatar.Group>
</Badge>

<Badge
  content={58}
  label="Notifications:"
  vertical="bottom"
  horizontal="right"
  variant="notification"
>
  <Avatar.Group label="Persons:">
    <Avatar size="large">A</Avatar>
  </Avatar.Group>
</Badge>

<Badge content={<Icon icon={Confetti} />}>
  <Img
    src="https://avatars.githubusercontent.com/u/1501870?v=4"
    alt="Profile picture"
    height="64"
    width="64"
  />
</Badge>

<Badge
  content={99}
  label="Notifications:"
  variant="notification"
  vertical="top"
  horizontal="right"
>
  <Icon icon={Email} size="x-large" />
</Badge>