Avatar

Avatars are images used to represent users and organizations on GitHub. They typically are squares with rounded edges.

Default example

To create a Parent + Child avatar combination, wrap Avatars in AvatarPair:

<Avatar mb={4} src="https://avatars.githubusercontent.com/primer" size={128} />

<Text is='p'>To create a Parent + Child avatar combination, wrap Avatars in AvatarPair:</Text>

 <AvatarPair my={4}>
  <Avatar src="https://avatars.githubusercontent.com/primer"/>
  <Avatar src="https://avatars.githubusercontent.com/primer"/>
 </AvatarPair>

System props

Avatar components get COMMON system props. Read our System Props doc page for a full list of available props.

Component props

NameTypeDefaultDescription
altStringPassed through to alt on img tag
isChildBooleanadds the avatar-child class if present
sizeNumber20adds the avatar-small class if less than 24
srcStringThe source url of the avatar image
Edit this page on GitHub