2-Column grid scrolling animation for features, process, timeline
Grid columns slide in opposite directions/reverse while scrolling in view.
A simple but slick animation where text changes color as you scroll down the page. Colors are reversed/inverted from black to white.Just replace the text, alter the layout as you wish, and the animation will run perfectly on all devices.
Use cases:
Each section is fully reusable, so you can duplicate, remove, or rearrange sections depending on your design. Just swap in your own content. The interaction will continue to work automatically.
Note: Not suitable to use with images because image colors get inverted as well.
Click the blue button on this page labelled "Use it for free". This will take you to the cloneable page on Webflow's website.
Click the button labelled "Clone in Webflow", and voila! You can customize and use the cloneable for free now.
Want to see this interaction in action inside a complete website layout? These templates incorporate the same effect as part of full landing pages or website designs. Helpful if you’re looking for real-world layout examples.
Completely free, fully responsive, no custom code, easy to customize sections, animations and even templates for your next Webflow website.
Over 300 businesses have used my templates to launch their websites faster and look more professional online. Go live in half the time and at a fraction of the cost of custom development, with one of my professionally designed and fully customizable website templates.