Scalable Vector Graphics (SVG) is a powerful text based graphic language that translates code into images. Now, you don’t need to know all the right code to make an SVG image there is plenty of software out there that can export your beautifully designed graphics into SVG format. Since SVG can scale so greatly without losing clarity, many web designers are making the jump to incorporate this type of style into their designs; here at TIK:TALK we’ve been using these technologies since they emerged on the scene!
But why use SVG instead of the regular PNG, JPEG, etc.? Well besides looking great on any screen size, you can ANIMATE IT! And there are several ways to do so:
A simple way to animate SVG is through CSS transformations, just by using @keyframes you can make some pretty cool animations.
Another way is an inline styling built right into SVG, called SMIL. This type of animation uses specific attributes to animate parts of your SVG graphic.