Floating Elements
Dynamic floating geometric shapes background with physics simulation - 3D effects and connection lines
Pro features
What the Pro version adds to this component.
Multiple Shape Types
6 different geometric shapes with customizable combinations
Connection Networks
Dynamic connection lines between nearby elements
Glow Effects
Customizable glow intensity and colors
Mouse Interaction
Elements respond to mouse movement with physics
3D Depth Effect
Optional Z-axis depth simulation with perspective scaling and depth sorting via the enable3D prop
Performance Optimized
FPS limiting and efficient rendering
Installation
Install via CLI
npx @moontra/moonui-cli add floating-elementsUsage
Floating Elements
Examples
Ocean Blue - Floating Particles
Deep ocean themed floating elements with smooth continuous animation
Sunset Vibes - Warm Elements
Beautiful sunset-themed floating shapes with warm gradient colors
Aurora Borealis - Glowing Connections
Mystical aurora-inspired floating elements with vibrant colors
Deep Space - Cosmic Elements
Space-themed floating elements with stars and cosmic shapes
Minimal Tech - Clean Design
Minimalist floating elements with subtle connections
Interactive Hero Section
Large hero section with mouse-interactive floating elements
3D Depth and Heart Shape
enable3D perspective with the heart shape — both advertised but previously never shown