Skip to content
All effectsSpinner

Cube Tumble

One square tumbling on two axes in turn. Two half-turns instead of one full spin, so each face lands flat before the next move.

Pure CSSSpinnerPro

Usage

Meant for

SpinnerEmpty State

Examples

On a Card

Two half-turns instead of one full spin, so each face lands flat before the next move. The perspective is baked into the transform — no wrapper. Big enough to be the picture of an empty state, which is where it belongs.

Preparing your workspaceImporting 248 components. This takes about a minute.

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