Avatar Size

1import { Avatar, AvatarFallback, AvatarImage } from "@/registry/ui/avatar";
2 
3export default function AvatarSizeDemo() {
4  return (
5    <div className="flex items-center gap-4">
6      <Avatar className="size-8">
7        <AvatarImage alt="@shadcn" src="https://github.com/shadcn.png" />
8        <AvatarFallback>CN</AvatarFallback>
9      </Avatar>
10      <Avatar className="size-10">
11        <AvatarImage alt="@shadcn" src="https://github.com/shadcn.png" />
12        <AvatarFallback>CN</AvatarFallback>
13      </Avatar>
14      <Avatar className="size-11">
15        <AvatarImage alt="@shadcn" src="https://github.com/shadcn.png" />
16        <AvatarFallback>CN</AvatarFallback>
17      </Avatar>
18      <Avatar className="size-12">
19        <AvatarImage alt="@shadcn" src="https://github.com/shadcn.png" />
20        <AvatarFallback>CN</AvatarFallback>
21      </Avatar>
22      <Avatar className="size-14">
23        <AvatarImage alt="@shadcn" src="https://github.com/shadcn.png" />
24        <AvatarFallback>CN</AvatarFallback>
25      </Avatar>
26    </div>
27  );
28}