import { Avatar, Icon } from 'react-native-magnus';

<Avatar bg="red300" color="red800">A</Avatar>

<Avatar bg="red300" size={32} color="red800">A</Avatar>

<Avatar bg="red300" size={28} color="red800">A</Avatar>

<Avatar bg="green800">
  <Icon name="user" color="white" fontFamily="Feather" />
</Avatar>

<Avatar bg="green800" rounded="lg">
  <Icon name="user" color="white" fontFamily="Feather" />
</Avatar>

<Avatar
  shadow={1}
  source={{
    uri:
      "https://upload.wikimedia.org/wikipedia/commons/thumb/a/a7/React-icon.svg/1024px-React-icon.svg.png"
  }}
/>

<Avatar.Group>
  <Avatar bg="red500" color="white">
    A
  </Avatar>
  <Avatar bg="blue500" color="white">
    B
  </Avatar>
  <Avatar bg="yellow500" color="white">
    C
  </Avatar>
</Avatar.Group>