Animated background with up to 8 glowing neon orbs and rotating light beams. Six entrance animations, three theme presets, interactive hover and click effects, and optional background textures. Built for hero sections, SaaS landing pages, and any dark-mode design that needs premium ambient motion.
Up to 8 individually sized and positioned glowing orbs
Rotating light beam on each orb with configurable speed
Six entrance animations — fade, slide up, slide down, slide left, slide right, scale
Three theme presets — cool, warm, monochromatic
Custom color mode — background, orb and beam colors
Hover scale effect on each orb — configurable scale multiplier
Three click effects — pulse, spin, glow
Optional background textures — dots, grid, noise
Texture opacity and scale controls
Individual size control per orb (200–1500px)
Animation speed multiplier (0.1–5x)
GPU accelerated CSS animations at 60fps
No dependencies
Theme & Colors
Theme — cool, warm, monochromatic presets
Use Custom Colors — toggle manual color selection
Background Color · Orb Color · Beam Color
Animation
Speed — animation speed multiplier (0.1–5)
Number of Orbs — 1 to 8
Entrance Animation — fade, slide up, slide down, slide left, slide right, scale
Orb Sizes
Individual size control for all 8 orbs (200–1500px each)
Background Texture
Texture — none, dots, grid, noise
Texture Opacity — visibility (0–1)
Texture Scale — pattern size multiplier (0.1–5)
Interactions
Enable Hover — toggle hover scale effect
Hover Scale — scale multiplier on hover (1–1.5)
Enable Click — toggle click animations
Click Effect — pulse, spin, glow
CSS keyframe animations for GPU-accelerated orb rotation
startTransition for React 18 performance
Conditional rendering — only active orbs rendered in DOM
Radial gradients for authentic neon depth per orb
Box shadows for neon halo glow effect
Optimized event handling for hover and click interactions
4 orbs · Cool theme · Fade entrance · Speed 1x
Hover enabled · Hover scale 1.1
Click enabled · Pulse effect
No background texture
Hero sections · SaaS landing pages · Tech company websites · Futuristic interfaces · Portfolio backgrounds · Product launch pages · Gaming websites · Dark mode designs · Creative agency sites
SEO Keywords
framer neon background · framer glowing orbs · framer animated background · framer neon orbs · framer dark background · framer glow effect · framer orb animation · framer hero background · framer neon component · framer background effect · framer light beam · framer ambient background · framer dark mode background · framer code component · framer background animation
Hamim Reza
