Lottie Animations are trending now because it’s very light in comparison with other web animation formats like GIFs. Premium Lottie Animations block for Gutenberg is a free block that gives you the ability to easily add Lottie Animations to your pages without any custom code.

Check Gutenberg Lottie Animation Block demo page from here.

---

---

Lottie Animation Gutenberg Block Layout Settings

1. Loop: Enable to allow lottie animation to play forever.
2. Reverse: This option will play Lottie Animation backward
3. Animation Speed: Set Lottie Animation speed by making it slower or faster.
4. Trigger: Select trigger action from none, hover, scroll or viewport.
   1. Scroll Speed: Set speed for Lottie animation while user scrolls up or down.
   2. Bottom: Set bottom point while user scrolling or Lottie enters the viewport.
   3. Top: Set top point while user scrolling or Lottie enters the viewport.
5. Size: Set size for the lottie animation.
6. Rotate (Degree): Change the angle of Lottie Animation.
7. Alignment: Align Lottie to left, center or right.

---

Style Settings for Lottie Animation Gutenberg Block

Customize background color, CSS filter, border and spacing for lottie animation block in responsive mode.

---