08 Animated SVG icons - pimmey/noo-docs GitHub Wiki
Using animated icons is really simple, you're just gonna need to paste the SVG code of the icon on your page. To accomplish that, go a head and download the needed icon pack from linea.io and open the downloaded pack. You're gonna need to find the icon in .svg format and open that with a text/code editor of your choice, then just paste the code in the .services-section element.
An example of how it might look:
<svg id="Layer_1" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="150px" height="150px" viewbox="0 0 64 64" enable-background="new 0 0 64 64" xml:space="preserve">
<path fill="none" stroke="#000000" stroke-width="2" stroke-miterlimit="10" d="M32.001,0.887c17.184,0,31.113,13.929,31.112,31.113 C63.114,49.185,49.184,63.115,32,63.113C14.815,63.114,0.887,49.185,0.888,32.001C0.885,14.816,14.815,0.887,32.001,0.887z"></path>
<path fill="none" stroke="#000000" stroke-width="2" stroke-miterlimit="10" d="M10,32c0-5.63,2.148-11.26,6.444-15.556 c8.591-8.593,22.521-8.593,31.112,0C51.852,20.74,54,26.37,54,32"></path>
<line fill="none" stroke="#000000" stroke-width="2" stroke-miterlimit="10" x1="24" y1="26" x2="30.333" y2="33.333"></line>
<circle fill="none" stroke="#000000" stroke-width="2" stroke-miterlimit="10" cx="32" cy="35" r="2"></circle>
</svg>