Animated_Pixel_Grid

Description:This React + Framer component, Animated Pixel Grid, creates a mesmerizing colorful pixel animation that grows, shrinks, and flickers dynamically across the screen. Each pixel behaves independently expanding and contracting in rhythmic waves—resulting in a vibrant, pulsating mosaic effect.

The animation runs on an HTML5 <canvas> for smooth performance and reacts to clicks or resizing, reinitializing the pixel layout dynamically. Users can customize various visual and motion parameters directly from Framer’s property panel, including:

• Background type — choose between solid color or image backdrop.

• Pixel gap — controls pixel density across the grid.

• Animation speed — defines the flickering and growth pace.

• Hue range & color count — generates a spectrum of dynamic colors.

This component is perfect for creative backgrounds, loading screens, or interactive art sections, bringing a lively and organic energy to any Framer project.