How to animate an SVG with CSS (Works in Github Readme)

In this video i show one way to create a looping animation of an SVG/ image using CSS. What led me to this was that i found a Github repo README.md that has a moving image and i needed to investigate further and create my own. This video explains how i achieved it.

Link to the code: https://github.com/danba340/svg-animation-readme-example

My Tutorial steps:

1. Add id to svg tag
2. Add classname to the tags inside the svg that should be animated.
3. Add style tag for CSS inside svg
4. add @keyframes nameofanimation and model the animation changes
5. Make a css selector #id .class and add animation: nameofanimation 0.5s infinite;

Say hi on twitter: https://twitter.com/barelydaniel

0:00 Intro 0:15 Why are we doing this? 0:35 How it can be achieved 1:12 The Implementation 3:03 Demo on Github.com 3:25 Like, Sub, BYE!

Dont forget to attribute Freepik if you use this SVG Icons made by Freepik from www.flaticon.com ... https://www.youtube.com/watch?v=TTCahueWQUw