Avatar Stack Animate 1 - Animate on hover

Free

AvatarStack with the animate prop spreading avatars apart on hover.

Shadcn Avatar Stack Animate 1 component

Component data

ID
avatar-stack/avatar-stack-animate-1
Access
free
Created
May 23, 2026
Type
example
Libraries
Radix UI, Base UI, React Aria

Avatar Stack Animate 1 component design & features

This example enables the AvatarStack animate prop so avatars spread apart when the user hovers over the stack. The transition reveals each avatar individually without changing the default compact layout at rest.

Animated stacks work well in interactive dashboards or marketing sections where a subtle hover effect draws attention to team or collaborator lists.