FREE GSAP animations for Webflow sites - FluidBlocks javascript function kit

Soma Szoboszlai
1 rating

Try the ultimate GSAP animation function kit for Webflow sites and for others

FluidBlocks is a constantly evolving function kit. Boost up your project, save thousands of hours, and level up as a designer. With these GSAP code blocks, you can boost your website with micro-interactions. "Plug-n-play", and easy to use.

Check the full library ๐Ÿ‘‰ FluidBlocks FULL Library

This is my first Greensock JS function that provides you an awesome hover interaction. The video is for WEBFLOW integration, but you can use the code in WordPress or other frontend frameworks too. We use attributes to set different transition values, but you can use class too to target multiple elements in the DOM.

๐Ÿš„ Speed up your Webflow site with GSAP animations!

Through my custom web design projects, I researched a lot... seriously... I spent days for finding the best solutions for these interactions and I learned a lot. FluidBlocks save time, money, and reduce development projects' costs for you. Webflow is a powerful, intuitive tool for building responsive websites. But you can go further!

If you want to extend your site's user experience you can use GSAP for advanced interactions, transitions and animations. GSAP is a powerful JavaScript library to animate SVGs, web elements and other effects.

โฑย Why you should use FluidBlocks?

By using these code blocks, you can create stunning custom animations and micro-interactions that Webflow cannot make. It will save you tremendous time of research on CodePen and Stackoverflow. These are ready-to-use Javascript functions that you can implement into your code editor in Webflow.

๐Ÿ‘Œย Easy implementation!

FluidBlocks are well-built functions that you can easily set up. I make detailed PDFs and videos about the implementations and play with the parameters.

๐Ÿ“ƒ How to use it? - Detailed ReadMe file in the pack!

  1. Build and style your elements in Webflow
  2. Link GSAP libraries from cdnjs
  3. Copy and paste FluidBlocks code into the Webflow code editor
  4. Set up the code with your own CLASS names and data-attributes.
  5. Publish ๐ŸŽ‰


By purchasing these FluidBlocks, you get the right to use one person. You can'tย RESELL,ย RENTย ORย LENDย the code blocks.

Don't forget to rate! โค๏ธ

Webflow / Code Skill level: You don't have to write code, but it is easier to use if you understand the basics of javascript. For example, targeting elements in JS

๐Ÿก Find me here:

๐Ÿ”— - Webflow Agency
๐Ÿ”— FluidGO Design&Webflow Subscription

I want this!
144 sales

GSAP code in reusable function source code and PDF ReadMe file with a video link. THANKS FOR EVERY DONATION! ๐Ÿ™

Webflow, WP, Custom
.js file with the function
ReadMe file
Chillout Video tutorial


(1 rating)
5 stars
4 stars
3 stars
2 stars
1 star

FREE GSAP animations for Webflow sites - FluidBlocks javascript function kit

1 rating
I want this!