Spinner
7 effects for the spinner family · every one loops · pure CSS unless a card says otherwise
The previews are open to everyone; the code of these effects comes with WunderUI Core and Pro.
A ring that breathes instead of turning. For a system that is thinking rather than fetching; nothing rotates, so nothing implies progress.
Four points falling inward and back out. Rotation lives on each dot's own transform, so the group never spins as a whole.
Two rings turning against each other. Opposing directions read as work being done; two rings turning the same way read as one thick ring.
One square tumbling on two axes in turn. Half-turns instead of one full spin, so each face lands flat before the next move, and four of them bring it back to the start, so the loop has no seam.
Two dots on one circle, a third of a turn apart. A negative delay is what sets the offset without a second keyframe set.
One element. A conic gradient with a radial mask is a ring; no border trick, no SVG, and the gap stays even at any size.
Twelve discrete steps instead of a smooth turn. A stepping hand reads as measured time passing; a smooth one reads as an unknown wait.