Avatar Stack
An interactive, stacked facepile of overlapping avatars that smoothly elevates and scales the hovered avatar to the front with spring physics, revealing the full image and name tooltip.
+1
Size:
Overlap:
Max:
Installation
Add the component directly to your repository using shadcn CLI:
npx shadcn@latest add Surajmaurya1/easyui/avatar-stack
API Reference
| Prop | Type | Default | Description |
|---|---|---|---|
| avatars | AvatarStackItem[] | [] | Array of avatar objects with id, src, alt, and fallback |
| max | number | 5 | Maximum visible avatars before showing the +N counter |
| size | 'sm' | 'md' | 'lg' | 'xl' | 'lg' | Dimension variant for each avatar circle |
| overlap | 'sm' | 'md' | 'lg' | 'md' | Negative margin overlap amount between adjacent avatars |
| showCount | boolean | true | Whether to show the +N counter badge for overflow items |
| showTooltip | boolean | true | Whether to show a floating tooltip label on hover |