Skip to content
All effectsAI & Agents

Plan Cascade

Steps tick off in order, not all at once.

Pure CSSAI & AgentsPro

Usage

Meant for

Agent PlanPlan StepStepper

Examples

On a Plan Step

Steps ticking off in order, each one brightening as its marker pops in. The overshoot on the marker is the only flourish — everything else is timing. Each Plan Step sits in a data-wm-label wrapper with its --wm-i; the marker is its data-wm-box.

Plan
4 steps · ship the motion pages
Read the design fileDone1.0s
Match the tokensDone2.3s
Build the screensDone3.6s
Open a pull requestDone4.9s

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