ANIM-010

Orbit Spinner

Orbital spinner for indeterminate waiting states.

More Animations

Working

Details

spinner orbit loading

Recommended uses

  • Async waits
  • Background jobs

Responsive behavior

Keep spinner diameter under 48px on mobile.

Accessibility

Provide a text status nearby. Disable orbit motion under reduced-motion.

Code examples

Adapt these to your project. Do not paste unrelated branding or colors blindly.

HTML

<!-- Example scaffold for ANIM-010. Adapt to your project. -->
<section id="ANIM-010" class="ai-design-example" data-zemew-component="animations" data-style="futuristic" data-version="1">
  <!-- Implement using the live preview as the visual reference -->
</section>

CSS

/* Scope demo styles so they cannot affect the rest of the site */
#ANIM-010.ai-design-example {
  /* mirror the preview treatment for ANIM-010 */
}

Machine-readable metadata

The live preview exposes semantic attributes an AI or developer can read from the page source:

id="ANIM-010" data-zemew-component="animations" data-style="futuristic" data-variant="orbit" data-animation="orbit" data-version="1"