Avator 头像
用图标、图片、字符的形式展示用户或事物信息
开发说明
头像类型
图片头像、图标头像、字符头像。
头像形状
圆形和 4px 圆角。
头像大小
四种大小:xl: 64px
、lg: 40px
、md: 32px
、sm: 24px
。
设计布局
可结合姓名、描述等文案进行展示。
何时使用
- 辅助信息定位:在列表内通过头像帮助快速查询定位人物或项目。
- 表示群组:通过头像组表示群组信息。
- 表示账号信息:通过头像表示当前登录账号信息。
搭配使用
- 与导航组合使用,通常会搭配单行文字或单个图标,用于识别身份信息、登录信息。
- 与列表组合使用,可搭配多行文字,用于展示结构化的成员名称及信息,方便快速识别。
- 可与徽标数字组合展示,可作为消息提示或人员数量提示等。
推荐/慎用
- 对于字符型头像,需要根据场景定义最大字符数,避免字符过多影响可读性,降低可识别度。
- 使用多个头像组合时,需根据场景和信息类型定义最长数量,避免数值过多影响可读性,降低使用效率。