About Pixel Reveal Pro
ixel Reveal Pro - Animated Image Component
Bring your Framer sites to life with Pixel Reveal Pro. This plug-and-play code component adds a sophisticated, grid-based pixelation reveal effect to any image as soon as it scrolls into view. Built specifically for Framer, it requires zero coding and is fully customizable directly from the properties panel.
Key Features
Scroll-Triggered Motion: The reveal animation is tied to Framer's
whileInView, ensuring the effect only plays when your audience actually sees the image.Fully Customizable Grid: Dial in the exact look you want by adjusting the number of rows and columns (from 2x2 up to 40x40).
Grayscale to Color Transition: Images start in a stylish grayscale and smoothly transition into full color as the pixels fade away.
Seamless Background Blending: Change the 'Cover Color' to match your section's background, creating an invisible, organic reveal.
Precision Timing Controls: Fine-tune the pixel fade duration, maximum staggered delay, and color reveal timing using intuitive slider controls.
Empty State Support: Features a clean placeholder when no image is selected, keeping your canvas organized during the design process.
Perfect For
High-impact hero section visuals
Creative portfolio galleries
Engaging product feature showcases
Tech and SaaS landing pages
How to Use
Copy the component into your Framer project's code assets.
Drag and drop Pixel Image onto your canvas.
Select the component and upload your image in the right-hand Properties panel.
Tweak the grid size, timing, and colors to match your brand's exact aesthetic.
