Introduction

The Lottie element allows you to add and customize your Lottie animation. You can play, pause, and stop your animation. You can set the speed of your Lottie animation and whether it plays in a loop.

There are 2 ways to set the Lottie animation you want to use:

1. You can change the src of the Lottie element to an external Lottie animation URL, for example, 'https://assets6.lottiefiles.com/private_files/lf30_vuxs5lpt.json'

2. You can add a valid Lottie JSON to your page code. A valid Lottie JSON file should should follow this schema animation.json file. While your Lottie JSON file doesn't need all the key-value properties listed in this file, it must include the following properties and types for your Lottie JSON file to be valid.

   Properties	Type
   "w", "h", "ip", "op"	Number
   "assets", "layers"	Array of objects

Tip: You can put your valid Lottie JSON in a public file and import it in your page code.