Avatar

display

An image element with a fallback for representing users or entities.

Preview
CNAGSM

Installation

npm install @launchapp/design-system
Import
import { Avatar, AvatarImage, AvatarFallback } from "@launchapp/design-system";

Examples

Avatar with Image

<Avatar>  <AvatarImage src="https://github.com/shadcn.png" alt="@shadcn" />  <AvatarFallback>CN</AvatarFallback></Avatar>

Avatar Fallback

<Avatar>  <AvatarFallback>AG</AvatarFallback></Avatar>

Props

PropTypeDefaultDescription
className
stringAdditional CSS classes.
src
stringSource URL for the avatar image (on AvatarImage).
alt
stringAlt text for the image (on AvatarImage).