バッジ
ラベル書体の、角のある状態タグです。spark は見てほしいひとつだけに使い、アウトラインとニュートラルは控えめにとどめます。
バリエーション
スパーク
プロパティ
▾
コード
import { Badge } from "@/components/ui/kit/ui";
<Badge variant="spark" dot>スパーク</Badge>すべての状態
ニュートラルスパークアウトライン
使い方
使っているトークン
| --panel | … |
|---|---|
| --line | … |
| --line-2 | … |
| --muted | … |
| --spark | … |
| --spark-tint | … |
| --spark-deep | … |
| --font-label | … |
値はスタイルシートからその場で読み込んでいるため、サイトの表示テーマに合わせて変わります。