A marker highlight badge that draws a highlighter stroke behind key words in headlines.
The import and the props worth knowing about, in one place.
import { Badge13 } from "@/components/beste/component/badge13";
// Inline emphasis, drop it inside a headline:
<h2>
Ship landing pages <Badge13 label="40% faster" /> with Beste UI
</h2>
<Badge13
label="new"
tone="pink" // "amber" (default) | "emerald" | "pink" | "sky"
/>Read from the component's own type, so this cannot drift from what it accepts.
| Prop | Type | Default | Description |
|---|---|---|---|
label* | string | — | The highlighted text |
tone | "amber" | "emerald" | "pink" | "sky" | — | Highlighter color |
className | string | — | Additional classes merged onto the root |