Holo Badge
The <holo-badge> component renders a small, non-interactive status or count indicator. If badge content updates dynamically (e.g. unread counts), wrap it in an aria-live region in your own markup so assistive technology announces changes.
Live Previews
Section titled “Live Previews”Variants
Section titled “Variants”<holo-badge variant="neutral">New</holo-badge><holo-badge variant="success">Active</holo-badge><holo-badge variant="warning">Pending</holo-badge><holo-badge variant="danger">Failed</holo-badge><holo-badge variant="info">Beta</holo-badge>API Reference
Section titled “API Reference”Properties
Section titled “Properties”| Property | Attribute | Description | Type | Default |
| --------- | --------- | ---------------------------------------- | ----------------------------------------------------------- | ----------- |
| variant | variant | The semantic style variant of the badge. | "neutral" \| "success" \| "warning" \| "danger" \| "info" | "neutral" |
| Slot Name | Description | | --------- | ----------------------------- | | (default) | The badge’s label/count text. |