Grid Transition

grid transition.The image is progressively uncovered using animated square pixels, creating a clean, digital-style reveal that feels both technical and elegant.

About this Component Grid Transition is a no-code animation component that reveals images through a dynamic pixel grid transition.The image is progressively uncovered using animated square pixels, creating a clean, digital-style reveal that feels both technical and elegant. Customizable Properties Image Image – Upload or replace the image to be revealed Pixel Style Pixel Color – Color of the pixel grid used during the reveal Pixel Size – Size of each pixel square (in px) Animation Direction – Reveal direction (Top, Bottom, Left, Right) Duration – Total length of the reveal animation Delay – Delay before the animation starts Interaction Play on Appear – Automatically plays when the component enters the viewport Play on Hover – Triggers the animation on hover instead of on load Use cases Hero sections · Image reveals · Editorial layouts · Portfolios · Experimental UI · Subtle visual accents

A clean grid-based transition