Avatar
An image element with a fallback for representing the user.
CN
Installation
npx neobrutal add avatar
Usage
import { Avatar, AvatarImage, AvatarFallback } from "@/components/ui/avatar"
<Avatar><AvatarImage src="https://github.com/shadcn.png" alt="@shadcn" /><AvatarFallback>CN</AvatarFallback></Avatar>
Examples
With Image
CN
Fallback
Displays initials when no image is available.
JD
Group
Display multiple avatars with an overflow indicator.
A
B
C
+2
Props
AvatarGroup
| Prop | Type | Default | Description |
|---|---|---|---|
| max | number | 3 | The maximum number of avatars to display before showing an overflow indicator. |