Infinite Grids — immersive background experience

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.

Key Features

Infinite Motion Grid

The grid continuously scrolls horizontally and vertically, creating a seamless looping animation that never breaks or resets visually.

Cursor Spotlight Interaction

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.

Dual-Layer Rendering

• Base layer: faint grid for subtle structure

• Spotlight layer: brighter grid revealed on interaction

Ambient Glow Blobs

Soft, blurred color blobs are placed in the background to add atmosphere and visual richness.

Fully Customizable Movement

Control speed independently on both axes to create calm or energetic motion.