跳到主要内容

Avatar 头像

用于展示用户头像,提升用户信息的可读性。


头像类型

图片头像、图标头像、字符头像。

头像形状

圆形和 4px 圆角。

头像大小

四种大小:xllgmdsm

设计布局

可结合姓名、描述等文案进行展示。

何时使用

  • 辅助信息定位:在列表内通过头像帮助快速查询定位人物或项目。
  • 表示群组:通过头像组表示群组信息。
  • 表示账号信息:通过头像表示当前登录账号信息。

搭配使用

  • 与导航组合使用,通常会搭配单行文字或单个图标,用于识别身份信息、登录信息。
  • 与列表组合使用,可搭配多行文字,用于展示结构化的成员名称及信息,方便快速识别。
  • 可与徽标数字组合展示,可作为消息提示或人员数量提示等。

推荐/慎用

  • 对于字符型头像,需要根据场景定义最大字符数,避免字符过多影响可读性,降低可识别度。
  • 使用多个头像组合时,需根据场景和信息类型定义最长数量,避免数值过多影响可读性,降低使用效率。