motion-background

Motion Background Ambient, living backgrounds that sit behind content without stealing focus. The goal is subtle, seamlessly looping motion that stays readable and performant. This skill is self-contained: every technique below ships its own runnable code — CSS, GLSL, and canvas — with no external dependencies beyond Three.js where a shader is involved. When to use Hero/landing background that subtly moves; section ambience. Login/splash/empty-state living backdrops. A gradient, mesh, aurora, shader, or particle/constellation field behind text or UI. Pick an approach Look Technique Cost Soft animated gradient/mesh CSS gradients + keyframes Cheapest, no JS Flowing aurora / organic noise GLSL fragment shader (Three.js full-screen quad) GPU, moderate Constellation / drifting dots Canvas 2D particles CPU, scales with count Depth / parallax Same shader/particles with mouse-driven offset Moderate Show more Installs 1.3K Repository iart-ai/motion-…n-skills GitHub Stars 44 First Seen Jun 23, 2026 Security Audits Gen Agent Trust Hub Pass Socket Pass Snyk Pass