SevIQ Motion — Basics

Self-contained SVG + CSS animation primitives. No JavaScript, no build step, no dependencies. Dual-theme via tokens, reduced-motion safe. Link /assets/motion/motion.css and drop in the markup. Editing & tuning guide →

Light theme All motion stops under prefers-reduced-motion.

Loaders

Globe

loader-globe

Spinner

.motion-spinner

Skeleton

.motion-skeleton

Progress

.motion-progress

Thinking dots

.motion-dots

Primers

Current flow

primer-flow

Phasors

.motion-phasor

State cues

live

Live dot

.motion-pulse-dot

Success check

.motion-check

Error cross

.motion-cross

Draw-in cues (check / cross) play once on load — reload to replay. More primitives are catalogued in the ADR; this gallery grows as they ship.