数据展示 / 04
标签 · 徽章
用于压缩信息密度的三类小型标记:表达分类与状态的 Tag、表达数量与提醒的 Badge、表达在线与运行状态的 Status 灯,以及它们的可关闭、可组合形态。
Tag 全样式
solid / outline / soft / 语义色基础形态
实心 · 推荐
描边 · 分类
柔和 · 草稿
Featured
Beta
Draft
语义色
已完成
已失败
待审核
处理中
实验特性
带状态点 · 带图标
运行中
已失败
警告
处理中
实验
已归档
带图标
已同步
15 分钟前
12 条评论
8,420 次浏览
可关闭标签
chip + tag-input标签输入框(回车新增 · × 删除)
设计系统
组件库
Tailwind
深色模式
输入内容后按回车即可生成新标签,点击标签右下角的 × 或按退格键可删除。
纯展示型可关闭标签
已选条件 1
已选条件 2
已选条件 3
筛选条件
数码 3C
¥200–¥500
现货
徽章 Badge
.badge数字 / 文字 / 红点
5
12
99+
99+
NEW
HOT
已认证
草稿
附着在图标与头像上
3
99+
陈
王
标签页与导航角标
共 128 笔订单近 30 天累计下单金额 ¥42,880
3 笔待付款订单最早一笔将于今天 18:00 自动取消3
96 笔已完成订单其中 82 笔已评价
状态灯 Status
ok / err / warn / run / idle五种状态
正常 · 服务健康
失败 · 需要排查
警告 · 接近阈值
处理中 · 正在同步
空闲 · 等待调度
已连接 · 延迟 12ms
在列表中的应用
order-service华东 2 区 · 4 个实例运行中
report-service华东 2 区 · 2 个实例异常
pay-service华北 1 区 · 6 个实例灰度中
user-service华南 1 区 · 3 个实例限流中
archive-service冷备节点 · 0 个实例空闲
组合场景
card / table / title
Pro
限时
团队版年度订阅
不限成员数量,含全部组件源码与行业模块模板。
源码交付
1 年更新
专属答疑
库存充足剩余 2 天
进行中
#PR-2481
设计令牌同步任务
将 Figma 变量同步到代码仓库,并生成 Tailwind 主题配置。
设计
自动化
需复核
同步中 68%12 文件
已失败
3
支付服务灰度发布
灰度批次 2 出现 500 错误,已自动回滚至上一稳定版本。
pay-service
v2.4.1
已回滚
错误率 4.2%