Give your sections immediate visual impact with animated gradient columns featuring spotlight, shine, and noise textures. It turns even the simplest layout into a premium, cinematic hero—no redesign required.
Gradient Columns reacts to the cursor on desktop and animates automatically on mobile. Motion is smooth, subtle, and performance-optimized, so it looks stunning without adding lag.
Instantly elevates a section without changing layout
Adds depth and motion that feel premium, not distracting
Mobile-first animation with automatic fallback (no cursor needed)
Works with any frame size — headers, hero sections, banners, and footers
Performance-tuned for desktop and mobile
Gradient controls (up to 8 colors, mirror mode, angle)
Spotlight & shine controls (direction, softness, opacity, radius)
Motion controls (distortion, mouse dampening, mobile animation speed)
Styling controls (column count, width, noise intensity, z-index)
Place Gradient Columns into a section
Set it to Absolute and stretch to fill
Add your content above it — done
Copy the URL and paste it into your Framer project to import it.
Aviral Lakhanpaul
