←→ 切换·Esc 返回

通知Notification

提示与状态反馈
用标题和详情通知一件较重要的事

通知比轻提示可以展示更多信息，适合后台任务、他人操作和耗时结果。需要稍后查看的消息还应进入通知列表并保留未读状态，不能只在角落出现一次。

审核未通过
封面临摹比例过高，请调整后重新提交。
查看原因 →
×

什么时候用

  • 审核 / 审批结果：带原因和「查看详情」入口
    审核未通过 查看原因 →
  • 新评论 / 新@提醒：不是当下操作的直接结果
    新评论「这个方案我觉得可以」查看 →
  • 后台任务完成：导出完成，附下载入口
    导出完成1,024 条数据已导出下载文件 →
  • 系统公告：版本更新、活动通知
    系统公告v2.4 已发布，新增深色模式更新日志 →

什么时候不用

  • 「保存成功」这种一句话 → 用 轻提示 Toast
    已保存一句话的事，用不着通知
  • 必须立刻处理 → 用 弹窗 Modal 直接拦下
    请先完成实名认证
    去认证
  • 要一直挂着的提醒 → 用 警告提示 Alert
    📢 本周六 02:00-04:00 系统维护，期间暂不可用
  • 一口气连推好几条 → 右上角被刷屏
    新评论
    导出完成
    系统公告
组成结构 · Anatomy
审核未通过封面临摹比例过高，请调整后重新提交。
×
1通知卡片Notification角落滑入的卡片，悬停可暂停自动关闭
2状态图标Icon区分信息 / 成功 / 警告
3标题Title一句话结论，加粗
4详细描述Description原因、影响和下一步入口
5关闭按钮Close手动关掉，不点也会超时消失
常见变体 · Variants
基础通知Basic
新评论
「这个方案我觉得可以」
×
有消息值得知道，但不急着处理
带操作链接With Action
导出完成
1,024 条数据已导出
下载文件 →
×
告知之外还要给一个下一步入口
警告类型Warning
存储空间不足
剩余不到 500MB，请及时清理
×
出现需要留意的隐患，如空间不足
典型使用场景
审核结果通知
审核未通过
封面临摹比例过高，请调整后重新提交。
查看原因 →
×
新消息提醒
新评论
林小hu:「这个方案我觉得可以，就按这版做。」
回复 →
×
导出完成下载
导出完成
1,024 条订单数据已打包完成。
下载文件 →
×
版本更新公告
系统公告
v2.4 已发布：新增深色模式与全局搜索。
更新日志 →
×