Scalable Vector Graphics (SVG) is an XML-based vector image format for two-dimensional graphics. There are various reasons why we should use this, some are listed below -

1. File size of well optimised SVG is less than any other image format(ex. png, jpg etc.).
2. Accessibility and SEO.
3. SVG’s can be animated and interactive.
4. SVG’s are resolution independent and responsive.
5. All Modern browser support SVG.
6. Various tools are available to create SVG’s like Illustrator, Figma etc.
7. SVG’s are easy to read and write. It has syntax like HTML.
8. Styling can be done on SVG’s using id’s and classes.
9. Practical use cases of SVG’s are logo, icons, creative graphics, graphs, etc.

SVG is Awesome.

See the Pen cycle loader: GSAP animation by tripti (@tripti1410) on CodePen.