Logo Cloud With Blur Animation
A logo grid with scroll-triggered entrance animations. Logos fade in from above with blur that clears as they enter the viewport.
Trusted by modern operators across industries.
From pilot to scale without chaos.
Logos are arranged in a responsive grid: 2 columns on mobile, 3 on medium screens and up. Each logo uses Framer Motion's whileInView trigger to animate when it enters the viewport.
The initial state positions logos 10px above their final position with full blur (10px) and zero opacity. When visible, logos animate to their natural position with blur clearing and full opacity. A staggered delay of 0.1 seconds per logo creates a cascade effect.
The heading is styled with neutral colors and includes a secondary line in lighter text. Logos use consistent sizing and dark:invert for theme compatibility.
Good for mid-page "trusted by" sections, partner pages, or anywhere logos should animate when users scroll to them rather than on page load.
More from Logo Clouds
Included with All-Access
One payment unlocks the code for this block and every other block, template and page.
Get All-AccessExplore more
About this block
Logos are arranged in a responsive grid: 2 columns on mobile, 3 on medium screens and up. Each logo uses Framer Motion's whileInView trigger to animate when it enters the viewport.
The initial state positions logos 10px above their final position with full blur (10px) and zero opacity. When visible, logos animate to their natural position with blur clearing and full opacity. A staggered delay of 0.1 seconds per logo creates a cascade effect.
The heading is styled with neutral colors and includes a secondary line in lighter text. Logos use consistent sizing and dark:invert for theme compatibility.
Good for mid-page "trusted by" sections, partner pages, or anywhere logos should animate when users scroll to them rather than on page load.