Badge with number

1import { Badge } from "@/registry/ui/badge";
2 
3const BadgeWithNumber = () => {
4  return (
5    <div className="flex flex-wrap items-center gap-3">
6      <Badge className="gap-2">
7        Projects <span className="opacity-70">6</span>
8      </Badge>
9      <Badge className="gap-2" variant="outline">
10        Members <span className="text-muted-foreground">11</span>
11      </Badge>
12      <Badge className="gap-2" variant="secondary">
13        Tasks <span className="text-muted-foreground">7</span>
14      </Badge>
15    </div>
16  );
17};
18 
19export default BadgeWithNumber;