コンポーネント

バッジ

カテゴリや状態を小さく読みやすく示します。

色調、ドット、サイズ

neutralbluevioletambergreenred

SupportedPartialUnknown

smmd

A dot carries state; the text always says it.

使用箇所： Platform behavior.

使い方とインターフェース

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>