Design AtlasWhere most rotating loaders feel like continuous spin, this one feels like a series of flips, giving it a clearer beat. It suits a spot where flipping is already the metaphor — a flashcard app, a brief pause right before a card-flip transition — and a plainer shape like a ring spinner is the safer default elsewhere.
A parent gets a perspective, and the square's keyframe alternates rotateX and rotateY by 90° at a time. Using steps() or sharp percentage boundaries instead of smooth ease keeps the "clunk, clunk" rhythm of a flip rather than a continuous spin.
A skeleton works better for a long wait covering the whole screen; skip it under 200ms. Give the wrapper role="status" and aria-live="polite", and hide the square with aria-hidden="true" since it's decorative. Under prefers-reduced-motion, swap the 3D rotation for a plain brightness change — perspective rotation can be especially uncomfortable for people sensitive to vestibular motion.