Animation

Make an element rotate endlessly

outils :
Illustration croce

Table of contents

Video

1. Select the element that will trigger the animation

  1. Select the element you want to rotate (ex: circle)
  2. Click in the interaction panel and choose the “Scroll into view” trigger

2. Create the animation

1. Select the “Rotate” animation

2. Assign a default position to the item: 0 DEG and 0s Duration

3. Add a transition to change the position of the element and specify the duration of the animation: 360 DEG in 15 sec (for example)

4. Add a transition for the element to return to its default position after the rotation is complete: 0 DEG and 0s Duration

3. Apply the Loop characteristic to the animation

Check “Loop” at the trigger level for the animation to loop

These tutorials might interest you

Our tutorials in the same category

See all our tutorials
Illustration traits
We use the best tools

Your site is developed using the best tools and best practices

Gemeos doesn't just offer you a website, but expertise in the best tools to guarantee you the best possible return on your investment.

Figma

To design your custom website and optimize its conversion rate

Webflow

For pixel-perfect, optimized integration of your website

Client-first

Organizing your project to perfection

Wized

To add advanced features to your project

Make

Automate your workflows and save maximum time