Documentation

Getting Started

All components are open source and free to use. Install them via the shadcn CLI or copy the source directly.

Prerequisites:

shadcn/uiframer-motionlucide-react

Avatar Stack

Displays a compact stack of overlapping user avatars with an optional overflow count, perfect for showing social proof.

Installation

npx shadcn@latest add https://shadcn-waitlist.netlify.app/r/avatar-stack.json

Usage

tsx

import { AvatarStack } from "@/components/avatar-stack";

<AvatarStack
  avatars={[
    { src: "/avatars/1.png", alt: "Alice" },
    { src: "/avatars/2.png", alt: "Bob" },
  ]}
  count={120}
/>

Props

Prop	Type	Default	Description
avatars*	{ src: string; alt: string }[]	—	Array of avatar image objects to display.
count	number	undefined	Total signup count shown next to the stack.
className	string	undefined	Additional CSS classes.

* Required