组件
Badge 状态标记
以简短文本帮助扫读，同时保留清晰语义。
Badge 适合分类、阶段和简短状态，StatusDot 适合密集列表中与状态文案并排出现。它们都不代表可点击操作，交互筛选使用 FilterChip 或按钮。
安装
pnpm dlx shadcn@4.22.1 add http://127.0.0.1:3040/r/v0.3.0/badge.json首次使用请先完成 Registry 与主题接入。
变体与状态
neutral 为默认信息，brand 为强调，success、warn、danger 表达语义，outline 为轻量边界。状态点使用相同语义色但没有 outline。
Props
| API / 属性 | 类型 | 默认值 | 说明 |
|---|---|---|---|
Badge.tone | neutral / brand / success / warn / danger / outline | neutral | 文本与表面语义 |
StatusDot.tone | 上述枚举，不含 outline | neutral | 点状状态 |
children / className | 原生 span 内容与样式 | — | 透传 span 属性 |
aria-* | 原生可访问属性 | — | 由实际内容决定 |
键盘与约束
静态标签不聚焦。状态必须有可见文本或等价名称；装饰性圆点可以设置 aria-hidden，避免读屏重复朗读。不要只依赖红绿区分成功与失败。
避免这样使用
不要让整行到处都是强调色；不要用 Badge 承载长段解释；不要为外观像标签就省略按钮的交互语义。
来源与版本
0.1.0，来自 Subtic apps/web/components/ui/badge.tsx。直接复用状态颜色与紧凑尺寸体系。
查看由当前源码生成的类型参考
只展示 Kitseed 自身定义的属性，原生 HTML 与 Base UI 透传属性请参阅对应上游说明。
StatusDot
| 属性 | 类型 | 默认值 |
|---|---|---|
tone? | "neutral" | "brand" | "success" | "warn" | "danger" | "neutral" |