PixelBlast

About this Component
PixelBlast is a highly customizable code component for Framer that creates generative, retro-style pixelated visual effects. It's built using WebGL and Three.js to render smooth, high-performance animations directly on a canvas, making it a powerful tool for creating visually rich backgrounds and interactive art.

🔗 Live Preview

Key Features

• Shape Variants: You can instantly change the shape of each pixel to be a square, circle, triangle, or diamond.

• Pattern Control: Adjust the Pixel Size, Pattern Scale (zoom), and Pattern Density to create a wide range of looks, from sparse and subtle to dense and chaotic.

• Color & Speed: Easily set a custom color for the pixels and control the animation speed.

• Liquid Mode: When enabled, the pixel grid distorts and "smears" around the user's cursor, creating a fluid, warp-like effect. The strength and radius of this effect are adjustable.

• Ripple on Click: When enabled, clicking on the component sends out a circular ripple wave through the pixel grid, adding a satisfying layer of interaction.

Use Cases

• Hero Sections: Create a stunning, eye-catching background for the main banner of a website.

• Portfolio/Creative Sites: Add a unique artistic flair that makes your design stand out.

• Feature Callouts: Use it as a subtle, animated backdrop for specific sections to draw user attention.

• Interactive Kiosks or Art: Because it responds to touch and mouse, it's great for displays where user engagement is key.

Refund Policy
Due to the nature of digital components, all sales are final and non-refundable.