Skip to content
All effectsAvatar

Avatar Row

Each avatar lifts and comes forward in turn. The z-index changes with the lift, so the raised one is never behind its neighbour.

Pure CSSAvatarPro

Usage

AKTSLRMB+9

Meant for

Avatar GroupList ViewKanban

Examples

On a Avatar Group

Each avatar lifts and comes forward in turn. Two details carry it: z-index switches rather than sliding, because an interpolated stacking order makes an overlapping row flicker, and the spring is on the way up only — on the way down it would dip each avatar below the line. The stagger comes from each child's position, so AvatarGroup needs no style per avatar.

AK
TS
LR
MB

The class is wm wm-avatar-row — the first half is the marker the trigger and reduced-motion rules hook into, the second is the effect.