Active
A group of nested arcs pulses outward in a wave, indicating synchronized, real-time cohort activity.
CSS
Cohort
15 animationsAlignment
Three vertical bars slide horizontally until their target tick marks align on a single vertical rule.
CSSBalance
A horizontal balance beam tilts gently before settling level as two nodes of different sizes slide into equilibrium.
CSSCapacity
An open ring gauge fills to a pre-defined tick mark, with the remaining stroke dimming to indicate maximum capacity.
CSSCluster
A cluster of five nodes gathers around a central pivot, rotating into a structured polygonal alignment.
CSSDistribution
Three vertical columns scale their heights in sequence, showing group distribution balancing.
CSSMatch
Scattered geometric nodes slide into aligned columns based on matching visual attributes, indicating group allocation.
CSSMerge
Three converging tracks meet at a central node, which pulses once to confirm group integration.
CSSPace
A lead indicator moves along a path while trailing nodes accelerate to catch up and match its position.
CSSProgress
A series of nodes on a linear track light up sequentially, trailing a connecting line as the group advances.
CSSRetention
A circular boundary expands to enclose several nodes, which then settle into stable internal orbits.
CSSSchedule
A calendar grid slides horizontally, with a highlighted column of dates pulsing to show active cohort weeks.
CSSSplit
A horizontal line splits into three parallel paths that advance together, representing subgroup creation.
CSSSync
Two parallel bar gauges fill in lockstep, their progress indicators pulsing upon simultaneous completion.
CSSTransfer
A node shifts from one vertical lane to another, with the target lane expanding slightly to receive it.
CSS