Animate Webstudio! (UNOFFICIAL)

⚠️ This is an UNOFFICIAL way to animate your Webstudio site.
Ani Motion is a lightweight (8.59 KB including CSS) library that adds minimalistic animations to your Webstudio site, including on Radix Components.
This is made by John as a community member and not related to the Webstudio Animation UI that will be built.
Ani Motion is available in the Marketplace.
Docs: dub.sh/ani
Demo: marketplace-an...
Project: dub.sh/ani-tem...
Build unlimited sites with Webstudio for FREE 👉 wstd.us/future...

[@John316Ministries]

This is sick 🎉🎉🎉🎉🎉 thanks John and Webstudio team for all these amazing updates! Can’t for real one to come out!

[@thedxrrkside]

The future is Open Source! Awesome!

[@360Creators]

That's so cool! Thanks man!! 😎

[@ZukunftBilden]

Awesome - finally!

[@ajhoyhoy]

This is so good! thank you so much

[@getwebstudio]

You're welcome!

[@uddeepon]

Love this. Thanks John!

[@bilalkarimbath9147]

Thanks so much for adding this animation capability! Now there's no reason to choose other platforms over Web Studio. Are there any plans for Figma integration in the near future?

[@ZukunftBilden]

i do need like micro loading in animation.Can I use this for it. So the text comes in when the page loads for the first time? Would also love a deeper dive on making animations with AI (Claude custom CSS)

[@YotamGuttman]

could you also show how you'd go about integrating GSAP in a webstudio website?

[@getwebstudio]

We have already documented it, its mostly how gsap works, integration in webstudio is very minimal docs.webstudio.is/university/how-tos/how-to-add-a-gsap-animation

[@dannybribiesca]

This is amazing! Thank you so much!

[@getwebstudio]

🙂