Design.Avatar

Author: @loidco

Avatar sizes

• XXLarge: 214*214

• XLarge: 120*120

• Large: 96*96

• Normal: 80*80

• Medium: 46*46

• Small: 28*28

• Xsmall: 24*24

• Mini（icon size）: 16*16

From Google+

Reference

• Google+

  • 214*214 used on accounts page
  • 120*120 used on personal profile page
  • 96*96 used on brief account info
  • 80*80 used on user list in "circles"&brief profile info
  • 50*50 used on top navigation bar
  • 46*46 used on followings's avatar on threads
  • 28*28 used on comments on threads
  • 24*24 used on top navigation bar on google homepage
  • 16*16 commonly used icon size

• Gravatar

  • Default:80*80

• Linkedin

  • xlarge：200*200
  • middle：6060 4040
  • small：20*20

• QQ：

  • qzone:100px，50px，30px
  • pengyou:100px，60px，30px

• Sina weibo

  • xlarge：180*180
  • large：80*80
  • normal：50*50
  • small：30*30

• Renren

  • maxium width: 200, height adapt to width
  • 177*177
  • 152*152
  • 100*100
  • 56*56
  • 50*50
  • 30*30

• Douban

  • large：maxium width 160, height adapt to width
  • small：48*48

• Baidu

  • large：110110;9090
  • middle：6565;5050

• Zhihu

  • large：100*100
  • middle：5050；3838
  • small：2727；2525

Usecases

• Register

  • Upload profile image: large (original)

• Profile page

  • avatar - large

• Setting

  • Change profile image: original, large, medium, small

• Timeline

  • Following: small
  • Brief profile info: medium
  • Recommended users list: small
  • Followers/following list: small
  • Comment: small
  • Recent visitor list: small

• Search users

  • Search advice: small
  • Search results: medium

• Top navigation bar: xsmall

• Notification

  • New followers: small/xsmall

• Message

  • Sender & recipient‘s avatar: small

• Other service

  • Forum
  • Blog

• Third-party services: medium/small