The Embed HTML export option enables quick and easy use of Lordicon in web projects. Copy an HTML code from the library and embed it on your page. With this solution, the source of the icon (JSON Lottie) is hosted on Lordicon CDN servers
Embed HTML
-
Open the software where you want to use animated icons such as Shopify, Wix, Weebly, or Squarespace.
-
Add “Embed HTML” iframe
-
Go to Lordicon library
-
Select and customize an animated icon
-
Click “Embed HTML” from the download menu
-
Adjust settings and click “copy”
-
Paste HTML code to iframe located in your website builder
-
Done!
Available animation triggers
In
This animation displays an icon reveal only once on the page load.
Hover
It plays animation from start to finish when the mouse cursor hovers over the icon.
Loop
Autoplay the animation as a perfect loop from the first to the last frame infinitely, with no user interaction.
Loop on hover
It plays animation on loop whenever cursor hovers over the icon or parented area. After moving the cursor away, the animation stops.
Click
It plays animation from start to finish when user clicks on the icon.
Morph
Hover the icon to play the animation from the first to the last frame. After moving the cursor away, the animation plays in reverse.
Boomerang
When you hover, the icon animation will play from the first to the last frame and immediately reverse.
Was this article helpful?
Sorry to hear that. How can we improve this article?