A decorative barcode badge with a monospace caption for editorial and print inspired sections.
The import and the props worth knowing about, in one place.
import { Badge11 } from "@/components/beste/component/badge11";
<Badge11 label="Est. 2019, Berlin" />
<Badge11
label="Serial No. 001"
bars={36} // number of bars (default 28)
tone="muted" // "foreground" (default) | "muted" | "primary"
hideLabel // bars only; label stays for screen readers
/>Read from the component's own type, so this cannot drift from what it accepts.
| Prop | Type | Default | Description |
|---|---|---|---|
label* | string | — | Label under the bars (also seeds the bar pattern) |
bars | number | — | Number of bars |
tone | "foreground" | "muted" | "primary" | — | Bars and label color |
hideLabel | boolean | — | Hide the visible label (it stays available to screen readers) |
className | string | — | Additional classes merged onto the root |