An eyebrow kicker badge with an accent square and uppercase, letter spaced label for section headings.
Requires shadcn/ui initialized. Run npx shadcn@latest init if you haven't.
import { Badge6 } from "@/components/beste/component/badge6";
<Badge6 label="About us" />
<Badge6
label="Our services"
tone="foreground" // accent square: "primary" (default) | "foreground" | "muted"
orientation="vertical" // stack the square above the label
labelClassName="text-background/70" // override label classes on dark surfaces
/>