Images Badge — React Component
Stacked avatar/image pill that fans open on hover — ideal for team badges, social proof, avatar groups, and template galleries.
Images Badge — Variant 1
Playground
Shape the component before you copy it.
Adjust the important props for this component and grab JSX that matches your choices.
size
Controls image diameter and pill height.
shape
Clipping shape applied to each image.
direction
Direction the stack fans out toward on hover.
Images Badge — Variant 2
Playground
Shape the component before you copy it.
Adjust the important props for this component and grab JSX that matches your choices.
size
Controls image diameter and pill height.
shape
Clipping shape applied to each image.
direction
Direction the stack fans out toward on hover.
Images Badge — Variant 3
Playground
Shape the component before you copy it.
Adjust the important props for this component and grab JSX that matches your choices.
size
Controls image diameter and pill height.
shape
Clipping shape applied to each image.
direction
Direction the stack fans out toward on hover.
Images Badge — Variant 4
Playground
Shape the component before you copy it.
Adjust the important props for this component and grab JSX that matches your choices.
size
Controls image diameter and pill height.
shape
Clipping shape applied to each image.
direction
Direction the stack fans out toward on hover.
Animation effects
Copy-paste ready
Use the Code tab above to inspect and copy this component into your project.
About Images Badge
The Images Badge renders a compact overlapping avatar group with a spring entrance animation. Avatars stack with slight offsets and fan out slightly on hover using Framer Motion spring physics. Display count is configurable and overflows into a "+N more" label. Use it as a social proof element to display team size, active user counts, or collaboration participant counts. A compact, high-impact social signal for SaaS landing pages.
Common use cases
- Team and collaborator count indicators
- Active user and customer count badges
- Social proof elements
- Collaboration feature highlights