The Infinite Grid component is a dynamic, interactive background system that creates a continuously moving grid with a cursor-based spotlight reveal and ambient glow effects.
It’s designed for modern landing pages, hero sections, and product interfaces where subtle motion and depth enhance visual storytelling without overwhelming content.
The grid scrolls infinitely in both directions, while a soft spotlight follows the user’s cursor to reveal a brighter version of the grid beneath. Combined with blurred gradient blobs, the result is a premium, futuristic background effect.
The grid continuously scrolls horizontally and vertically, creating a seamless looping animation that never breaks or resets visually.
A radial spotlight follows the user’s cursor, revealing a brighter grid layer beneath the surface. This adds depth and interactivity to otherwise static layouts.
Base layer: faint grid for subtle structure
Spotlight layer: brighter grid revealed on interaction
Soft, blurred color blobs are placed in the background to add atmosphere and visual richness.
Control speed independently on both axes to create calm or energetic motion.