Avatar

Represents a person or entity with an image and a reliable text fallback across five sizes and seven designs.

Installation

bunx @swift-rust/ui add avatar

Usage

tsx

1import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar";
2 
3<Avatar size="lg" design="gradient">
4  <AvatarImage src="/avatar.jpg" alt="Ada Lovelace" />
5  <AvatarFallback>AL</AvatarFallback>
6</Avatar>

Composition

Avatar is composed of these parts:

Avatar
├── AvatarImage
└── AvatarFallback

Examples

size

← Aspect Ratio Badge →