Avatar

Avatar, a React Native component for iOS, Android and web: A user image with initials and placeholder fallbacks.

Usage

import { Avatar } from './components/ui/avatar';
import { Stack } from './components/ui/stack';

export default function Example() {
  return (
    <Stack direction="horizontal" gap={3} align="center">
      <Avatar name="Asha Rao" size="sm" />
      <Avatar name="Tomas Lindqvist" />
      <Avatar name="Mei" size="lg" />
      <Avatar aria-label="Unknown person" />
    </Stack>
  );
}

Props

Prop	Type	Default	Description
`src`	`string \| ImageSourcePropType \| null`		URL or bundled `require()`. Falls back to initials when missing or when it fails to load.
`name`	`string`		Used for the initials and the accessible name.
`size`	`'sm' \| 'md' \| 'lg'`	'md'
`style`	`StyleProp<ViewStyle>`