With the rise in popularity of SVG’s, now is the perfect time to create new assets that can be used responsively across all screen sizes and resolutions. In this post i have compiled 11 best resources where you can download free animated SVG icons to use in your existing and future projects.
Loading icons and small animations built purely in SVG, no CSS or JS.
Animated icons, symbols and buttons using SVG and CSS.
Free Animated SVG Icons
There are 6 different sets of icons with various differences in styling and animation. All the styling and animation is done exclusively in CSS, externally from the inline SVG mark-up.
Simple Icon Hover Effects
A set of simple round icon hover effects with CSS transitions and animations for your inspiration.
Animated weather icons
Animated Adam Whitcroft’s awesome Climacons with CSS. Inspired by Forecast.io’s animated weather icons, but wanted to achieve the same results without canvas.
The single element HTML/CSS icon database.
Beautiful icons using css/3, which makes your site light and fewer http requests.
Animated Navigation Icons with CSS Transforms.
Yet Another Set of Animated Social Icons
A simple spinning and border-radius animation on :hover for social icons. Social icons from icomoon and initial design by Nikki Clark
Animated SVG Icons
Using SVGs on websites is becoming more and more easy with great libraries like Snap.svg. Today we want to explore what we can do with it and animate some SVG icons as a practical example.