组件

徽标

以小巧、清晰的徽标显示分类或状态。

色调、圆点与尺寸

neutralbluevioletambergreenred

SupportedPartialUnknown

smmd

A dot carries state; the text always says it.

DemoBadge 会渲染 span.ui-badge，并将 tone、variant（soft 或 dot）及 size（sm 或 md）映射到数据属性。徽标属于注释，应放在需要测量的 flex、grid 或 float 布局之外。

<DemoBadge tone="green" variant="dot">Supported</DemoBadge><DemoBadge size="sm">Static</DemoBadge>

<span class="ui-badge" data-tone="green" data-variant="dot">Supported</span><span class="ui-badge" data-size="sm">Static</span>