About this cloneable

The Cards Spread on Scroll effect creates a subtle, elegant interaction where multiple cards smoothly separate and move apart as the user scrolls down the page.
It adds a modern, polished feel to your website while making important content sections stand out naturally.

It’s a fantastic way to:

  • Highlight featured content
  • Showcase products, services, photo gallery, team members, and more
  • Break up long text sections
  • Create more visual interest without overwhelming users

Key features

  • Fully responsive: The animation works beautifully across all devices — desktop, tablet, and mobile — without breaking your layout
  • No custom code needed: Built 100% with Webflow interactions (IX2). You can clone it and adjust it easily without touching any code
  • Easy to customize: Change the photos and even text to the cards if you'd like
  • Lightweight and performance-friendly: No heavy scripts or third-party plugins. Just clean Webflow-native animations designed for fast load times

How to access and use this cloneable

  1. Click the blue button on this page labelled "Use it for free". This will take you to the cloneable page on Webflow's website.

  2. Click the button labelled "Clone in Webflow", and voila! You can customize and use the cloneable for free now.

Overlapping photo cards spread while scrolling animation

Create a smooth card spread animation to show photos, team, services, and more while scrolling with this free Webflow cloneable.

Explore premium Webflow website templates

Building your website doesn’t have to be a hassle. Launch in half the time and at a fraction of the cost of custom development, with a professionally designed and fully customizable website template.