Who doesn’t love animated icon? Animated icon will contain the right balance of thoughtful messaging and playfulness and can be a tool to draw the user`s attention to a certain part of the screen. So in this post we`ve put together collection of awesome animated icons that you can use to improve user experience.

Useanimations

Animated icons in Lottie Framework and After Effects for immediate implementation to your apps or websites.

Source

200 Free Animated Icons

Everyone loves pages that pop with personality. Add visual interest to web and mobile user interfaces with our pack of 200 animated icons. Get them in multiple formats–download GIF, JSON (Lottie) and After Effects. These motion graphics are all free for a link, so go ahead and download animations to polish your checkout experience, media interactions, or social sharing.

Source

Potlab

Animated SVG icons for web projects. You can customize the icon for your project like colors, stroke, and size.

Source

Tasty CSS-animated hamburgers

This is a collection of tasty CSS-animated hamburger icons. Also included is the source as a Sass library. It’s modular and customizable, so cook up your own hamburger.

Source

LivIcons Evolution

This is collection of animated vector icons with individual animation for each icon and powered by Javascript library – jQuery. The main purpose of this script is to bring more individuality and interactivity to customers` sites and make them stand out from the competition. Put the LivIcons to work for you.

Source

Titanic

A collection of animated icons + javascript library.

Source

Transformicons

Animated symbols and buttons packaged for Sass & CSS.

Source

Animated SVG Icons with Snap.svg

With great libraries like Snap.svg the use of SVG assets becomes more easy and today we’d like to explore how to animate SVG icons.

Source

Animaticons

Beautiful, customizable animated GIF icons. Great solution if you don`t want CSS and SVG code to implement.

Source

Iconate

It is a tiny performant library for cross-browser icon transformation animations in your projects.

Source

SVG Loaders

Loading icons and small animations built with pure SVG.

Source

Icon Hover Effects

A set of simple round icon hover effects with CSS transitions and animations for your inspiration.

Source

CSS Spinner

Collection of 12 small, elegant pure css spinners for your website loading animation.

Source

150 Animated SVG Icons

Using SVG Icons on websites is becoming easier, and they are used to make your portal more elegant. These SVG animated icons will help you to represent significant things with simple icons.

Source

SEO Icons

These animated SVG SEO icons will bring life to even the most basic pages.

Source

Animated Weather Icons

Weather SVG Animated Icons which you can easily integrate to any project to make it feel more lively.

Source

Animated SVG Social Media Icons

These animated SVG icons are the perfect way to send your customers to your social media.

Source

Animated SVG Icon

Are you looking for some ready svg files? This incredible SVG icon pack has it all.

Source