This component no longer exists. It was in Pure UI’s manifest when we first indexed it and is not there now — the registry served its inventory on 2026-08-10 and this item was not on it. The install command below will fail. It is kept here because a tutorial somewhere still tells people to run it.

avatar-grouping-demo

pure-ui/avatar-grouping-demo

RemovedExample

Pure UI publishes no description for this item.

Install it

npx shadcn@latest add https://raw.githubusercontent.com/MusKRI/pure-ui/main/public/r/avatar-grouping-demo.json

Source

src/registry/pure-ui/examples/avatar/avatar-grouping-demo.tsxraw.githubusercontent.com/MusKRI/pure-ui/main/public/r/avatar-grouping-demo.json

1import {
2  Avatar,
3  AvatarFallback,
4  AvatarImage,
5} from "@/registry/pure-ui/ui/avatar";
6
7export function AvatarGroupingDemo() {
8  return (
9    <div className="-space-x-[0.6rem] flex">
10      <Avatar className="ring-2 ring-background">
11        <AvatarImage
12          alt="U1"
13          src="https://pbs.twimg.com/profile_images/1904866883041714179/MhesgL6S_400x400.jpg"
14        />
15        <AvatarFallback>U1</AvatarFallback>
16      </Avatar>
17      <Avatar className="ring-2 ring-background">
18        <AvatarImage
19          alt="U2"
20          src="https://pbs.twimg.com/profile_images/1904866883041714179/MhesgL6S_400x400.jpg"
21        />
22        <AvatarFallback>U2</AvatarFallback>
23      </Avatar>
24      <Avatar className="ring-2 ring-background">
25        <AvatarImage
26          alt="U3"
27          src="https://pbs.twimg.com/profile_images/1904866883041714179/MhesgL6S_400x400.jpg"
28        />
29        <AvatarFallback>U3</AvatarFallback>
30      </Avatar>
31    </div>
32  );
33}

What it pulls in

Other registry items

avatar

Files it writes

src/registry/pure-ui/examples/avatar/avatar-grouping-demo.tsx