Aurora Orbit

Give your website a highly premium and modern feel with the Aurora Orbit background component.

Give your website a highly premium and modern feel with the Aurora Orbit background component. This GPU-accelerated effect generates a beautiful, fluid light show resembling the northern lights or a deep space nebula. The animation organically orbits a central void, blending three distinct color bands smoothly over your chosen background color. Designed for maximum visual impact without sacrificing performance, it includes a smart auto-pause feature that stops the animation when scrolled out of view, saving your visitors' battery and CPU. Whether you're building a sleek dark-mode portfolio, an AI startup landing page, or a Web3 project, you have complete control over the orbit speed, swirl intensity, bloom, and exact positioning to perfectly match your brand's unique aesthetic. Functions (Key Features): 🪐 Fluid Aurora Dynamics: Smooth, swirling bands of light that organically orbit a central point. 🎨 Rich Color Blending: Seamlessly mix three distinct aurora colors (Inner, Middle, Outer) over a base background. 🎛 Total Shape Control: Adjust the swirl intensity, bloom, zoom scale, and the size of the central void. 📍 Precise Positioning: Easily offset the center point along the X and Y axes to frame the effect perfectly behind your content. 🚀 Smart Performance: Optimized rendering with an auto-pause mechanism when the component is off-screen. How to Use: Copy & Paste: Copy the component and paste it directly onto your Framer canvas. Layout Setup: Set the component's Width and Height to "Fill" (100%) and place it as an absolute background layer behind your content. Color Palette: Pick your Background color, then select three harmonious colors for the Inner, Middle, and Outer Aurora bands. Shape & Position: Use Void Size to adjust the empty center, and the Position X/Y sliders to move the focal point of the orbit. Fine-Tune Animation: Adjust the Orbit Speed , Waviness (controls the swirl/distortion) , and Bloom / Glow to create the perfect ambient atmosphere.

Animated aurora orbit background.