An image element with a fallback for representing the user.
CN
import { Avatar, AvatarFallback, AvatarImage } from "@/registry/ui/avatar"
export default function AvatarDemo() {Installation
pnpmnpmyarnbun
Usage
import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar"<Avatar>
<AvatarImage src="https://github.com/shadcn.png" alt="@shadcn" />
<AvatarFallback>CN</AvatarFallback>
</Avatar>Examples
With Fallback
JD
import { Avatar, AvatarFallback, AvatarImage } from "@/registry/ui/avatar"
export default function AvatarFallbackDemo() {Different Sizes
import { Avatar, AvatarFallback, AvatarImage } from "@/registry/ui/avatar"
export default function AvatarSizes() {