v1.0.1
MENU ANIMATIONS
CORE BACKGROUND
UI SURECART
BUTTONS
Clouds
Creates a realistic 3D animated sky with volumetric clouds and dynamic sunlight using Three.js and Vanta.js. Features floating clouds with depth, shadows, and atmospheric lighting effects. Clouds drift naturally across the sky with sun rays creating realistic light scattering. Uses WebGL rendering with fully customizable sky colors, cloud formations, and lighting. Perfect for hero sections, atmospheric backgrounds, or creating immersive outdoor scenes.
Clouds
Realistic 3D sky with drifting volumetric clouds.
Sky & Atmosphere
Base color of the sky background. Choose blue tones for daytime, orange/pink for sunset, or darker tones for dusk scenes.
Default: Sky Blue (#68b8d7)
Color of the sun disc in the sky. Bright yellows and oranges create warm, sunny atmospheres.
Default: Orange (#ff9919)
Color of the bright glow around the sun. Creates the intense light halo effect for realistic sun rendering.
Default: Red-Orange (#ff6633)
Color of light rays and atmospheric lighting. Affects how sunlight illuminates the clouds and sky.
Default: Golden Orange (#ff9933)
Clouds
Main color of the cloud formations. Lighter colors create fluffy white clouds, darker tones create storm clouds.
Default: Light Blue-Gray (#adc1de)
Color of shadows within cloud formations. Darker values create more dramatic depth and volume in the clouds.
Default: Dark Blue (#183550)
Animation
Speed of cloud drift across the sky. Lower values create calm, peaceful movement. Higher values create faster, windier conditions.
Default: 1.0
Performance
This element uses Three.js r121 and Vanta.js Clouds for 3D WebGL rendering. Creates volumetric clouds using layered 3D planes with transparency and depth effects. Features realistic lighting with sun position, light rays, and atmospheric scattering simulation. Dynamic camera controls with mouse and touch interaction. Uses continuous requestAnimationFrame loop for smooth 60fps animations. Automatically loads Three.js and Vanta.js from CDN if not present. Very resource intensive - limit to 1 instance per page. Not recommended for mobile devices or low-end hardware due to GPU requirements.