This guide gives the best practices to follow to embed, control and customize Lordicon animated icons in your Webflow projects.
Webflow
Key takeaways
-
Integrate Lordicon Lottie animations into Webflow.
-
Adjust colors, thickness, and animation style to mach your website theme.
-
Learn about trigger-based animations
Lottie JSON implementation method
Webflow took a step ahead and brought the power of Lottie animation directly to the platform. This means you can add animated icons as Lottie JSON files to Webflow servers and play it on your website.
-
Select and download animated icon in Lottie format
-
Go to your Webflow website and edit the site.
-
Add the “Lottie Animation” element from the media panel.
-
Upload the downloaded icon.
-
Select the animation trigger from the interaction panel and adjust the settings.
-
Click Play to preview animation
Tutorials
Jesse Showalter
Navigation with Animated Icons | Figma + Webflow + Lordicon
This content requires cookies. You must accept cookies to view it.
Sorry to hear that. How can we improve this article?