As of April 30, 2025, all GSAP features — including the core library and previously paid plugins — are natively supported via a free GSAP Library. This makes it easier than ever for you to build motion-rich experiences on your site with minimal setup. Since GSAP animations are supported in Webflow, they don’t require external file hosting.
How to enable GSAP on your Webflow site
- Go to your site in Webflow
- Go to the Settings panel
- Click GSAP integration
- Toggle the GSAP library on
- Use checkboxes to enable plugins
Note
If you have a Workspace or Site plan that allows you to add custom code to your site, you can also load the GSAP library and plugins from Webflow’s CDN.
Once enabled, you can begin writing GSAP-powered animations in Page settings > Custom code > Before </body> tag or using <script> tags inside Embed components.
You can preview your custom code animations before publishing.
How to set up custom code for configuring animations with GSAP
Important: Our support team is unable to provide direct help with custom code setup or troubleshooting, as these topics fall outside the scope of our customer support policy. If you run into issues with custom code, please let us know on the Webflow Forum, where the entire Webflow community (staff included) can provide additional help and resources.
When setting up your custom code for configuring animations with GSAP, we recommend listening for DOMContentLoaded to ensure that all elements are loaded before you attempt to interact with them. Note that your plugins are auto-registered and Webflow is loads your scripts for you.
Your custom code will look something like this:
<script>
window.addEventListener("DOMContentLoaded", () => {
//Configure your animation here
});
});
</script>Additional resources