Avatar

import { Avatar } from 'theme-ui'

<Avatar src={images.logo} sx={{ backgroundColor: 'white' }} />
<Avatar src={images.logo} sx={{ backgroundColor: 'white' }} />

Variants

Avatar style variants can be defined in the theme.images object and uses theme.images.avatar by default.

// example theme variants
{
  images: {
    avatar: {
      width: 48,
      height: 48,
      borderRadius: 99999,
    },
  }
}