Grid Transition
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.
Image – Upload or replace the image to be revealed
Pixel Color – Color of the pixel grid used during the revealPixel Size – Size of each pixel square (in px)
Direction – Reveal direction (Top, Bottom, Left, Right)Duration – Total length of the reveal animationDelay – Delay before the animation starts
Play on Appear – Automatically plays when the component enters the viewportPlay on Hover – Triggers the animation on hover instead of on load
Hero sections · Image reveals · Editorial layouts · Portfolios · Experimental UI · Subtle visual accents
Francesco Caronte
