v1.3.3
MENU ANIMATIONS
ADVANCED EFFECTS
CORE BACKGROUND
Nebula Rift
Creates a cosmic nebula effect with dynamic voronoi distortion using WebGL2 and UnicornStudio.js. Features multi-layered GLSL shaders combining procedural nebula generation with turbulence, bloom effects, and animated voronoi displacement. Supports customizable color palettes, animation speeds, and distortion parameters for creating unique space-like atmospheres.
Nebula Rift
Cosmic nebula with dynamic voronoi distortion.
Colors
Base background color behind the nebula effect. Dark colors work best to make the nebula glow stand out. Supports hex, RGB, and HSL formats.
Default: #000000 (black)
Base hue position on the color wheel for the nebula. 0 is red, 0.33 is green, 0.57 is blue/purple, 0.66 is blue. Controls the primary color family of the effect.
Default: 0.57 (purple/blue)
Range of color variation across the nebula. Higher values create more diverse, rainbow-like transitions. Lower values keep colors more uniform and monochromatic.
Default: 0.25
Shifts the color palette along its gradient. Use to fine-tune which part of the color spectrum appears most prominently in the nebula.
Default: 0.5
Nebula
Animation speed of the nebula layer. Controls how fast the nebula flows and evolves. Lower values create slow, dreamy movement.
Default: 0.25
Frequency of the turbulence noise applied to the nebula. Higher values create more detailed, intricate patterns. Lower values produce smoother, flowing shapes.
Default: 0.5
Strength of the turbulence displacement. Higher values create more dramatic warping and movement. Lower values produce subtle, gentle undulations.
Default: 0.5
Softness of the nebula edges. Higher values create more diffuse, cloud-like boundaries. Lower values produce sharper, more defined structures.
Default: 1.0
Intensity of the glow/bloom effect on bright areas. Higher values create more pronounced glowing highlights. Set to 0 for no bloom.
Default: 0.75
Voronoi Distortion
Animation speed of the voronoi distortion layer. Controls how fast the cellular patterns shift and morph. Independent from nebula speed.
Default: 0.5
Size of the voronoi cells. Lower values create larger, more spaced-out cells. Higher values create smaller, denser cellular patterns.
Default: 0.31
Rotation angle of the voronoi pattern (as fraction of full rotation). Use to orient the distortion pattern at different angles.
Default: 0.1053
Stretches the voronoi pattern horizontally. At 1.0, creates elongated, streaky distortion. At 0, keeps cells more circular and uniform.
Default: 1.0
Overall strength of the voronoi displacement effect. Higher values create more dramatic warping. Set to 0 to disable distortion entirely.
Default: 0.34
Performance
This element uses WebGL2 with UnicornStudio.js runtime and three separate GLSL shader layers: background gradient, procedural nebula with 36 iterations, and voronoi FBM distortion with 6 octaves. Features Reinhard tone mapping, PCG random noise for dithering, and additive color blending. Runs at 60fps with 1.5x DPI scaling. Very resource intensive due to multi-pass shader pipeline - limit to 1 instance per page. Consider reducing animation speeds on lower-end devices.
