How To Add Animation In Webflow

‍

Here is how to add animations in Webflow:

1. Begin by selecting an element you wish to add animation to.
2. Go to the Interactions tab on the right sidebar menu.
3. Select a type of trigger for your animation.
4. In this example we'll trigger an animation using a simple click. To do so, select Element trigger using the (+) icon next to it.
5. Select Mouse click.
6. Mouse click typically contains two options, what happens on first click and then the second click (usually used to reverse it). Click on Action.
7. Select from any premade animations or create your own.
8. Adjust your animation and click on Preview to see it in action.
9. You can use the Preview mode on the top right to interact with it.
10. You now have an animation on your button that will make it appear on click.