徽章设计体系

在不侵犯主要内容的情况下添加数量或状态。

4 个检查项 · 2 个内容分组

清单内容

检查进度

结构及意义

在使用环境中比较信息和演示。

说明徽章的含义使用清晰的标签或上下文区分未读数字、总数和状态。一个彩色点不足以向所有人解释状态。示例 “通知”按钮的访问名称为“3 个未读通知”。附加正确的对象将徽章放置在其修改的部分附近，并且不要覆盖图标或文本。保持徽章位置一致,并尝试不覆盖图标或使主要对象难以单击的长值。

尝试操作，更改状态并继续工作。

处理大数和零隐藏 0、截断 99+ 或显示完整值时统一。点表示更新,数字表示数量;根据真正需要传达的信息来选择。保持可区分的状态测量对比度，当颜色传达含义时添加文本或符号。根据相同的徽章集约定保持边框、角度和颜色;仍然需要在不区分颜色的情况下理解含义。

进度会自动保存在此浏览器中。

指南

一个彩色点不足以向所有人解释状态。

示例

“通知”按钮的访问名称为“3 个未读通知”。