ElasticGridPro

Elevate Your Digital Canvas

Elastic Grid Pro is not just another background pattern; it is a sophisticated Kinetic Fabric Engine built for Framer designers who demand performance and polish. This component reimagines the traditional grid as a reactive, physical entity that bends, ripples, and glows in direct response to user behavior.

Engineered for Performance

Unlike standard SVG or DOM-based grids that lag under heavy interaction, Elastic Grid Pro utilizes low-level TypedArrays (Float32Array) and the HTML5 Canvas API. This ensures that even with hundreds of interactive points, your site remains locked at a buttery-smooth 60FPS, providing a premium feel that won't compromise your SEO or page load speeds.

Advanced Physics & Interaction

Choose between three distinct interaction profiles:

- Magnetic Pull: Attracts grid lines toward the cursor, creating a deep sense of focus.

- Repulsive Push: Displaces the grid away from the cursor for a tactile, physical barrier effect.

- Fluid Wave: Generates rippling dynamics that simulate a surface made of liquid energy.

Complete Design Sovereignty

Take full control of the aesthetic with comprehensive property controls. Adjust the Perspective Tilt to create a 3D floor or ceiling effect, customize the Ambient Wave Engine to keep the site alive during idle states, and fine-tune the Glow & Speculars to match your brand's unique lighting profile.

Technical Capabilities

- Variable Cell Density: Define the exact scale of your grid system.

- Elasticity & Damping: Control the 'snap-back' intensity and movement friction.

- 3D Perspective Control: Rotate the grid on the X-axis for panoramic depth.

- Radial Glow Tracking: Interactive light source that follows the cursor through the mesh.