Skip to main content

Avatar

Avatars are found throughout material design with uses in everything from tables to dialog menus.

๐Ÿ’ฌ Feedback

Import

import { Avatar } from "@react-native-material/core";

Letter avatars

Image avatars

Icon avatars

Sizes

Coloring

Fallbacks

Props

label

Type: string | React.ReactElement | ((props: { color: string }) => React.ReactElement | null) | null;

Optional: Yes


image

Type: ImageSourcePropType | React.ReactElement | ((props: { size: number }) => React.ReactElement | null) | null;

Optional: Yes


icon

Type: React.ReactElement | ((props: { color: string; size: number }) => React.ReactElement | null) | null;

Optional: Yes


size

Type: number;

Optional: Yes


color

Type: PaletteColor;

Optional: Yes


tintColor

Type: PaletteColor;

Optional: Yes


initials

Type: boolean;

Optional: Yes


uppercase

Type: boolean;

Optional: Yes


autoColor

Type: boolean;

Optional: Yes


style

Type: StyleProp<ViewStyle>;

Optional: Yes


contentContainerStyle

Type: StyleProp<ViewStyle>;

Optional: Yes


imageContainerStyle

Type: StyleProp<ViewStyle>;

Optional: Yes


labelStyle

Type: StyleProp<TextStyle>;

Optional: Yes


imageStyle

Type: StyleProp<ImageStyle>;

Optional: Yes