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 -
- File size of well optimised SVG is less than any other image format(ex. png, jpg etc.).
- Accessibility and SEO.
- SVG’s can be animated and interactive.
- SVG’s are resolution independent and responsive.
- All Modern browser support SVG.
- Various tools are available to create SVG’s like Illustrator, Figma etc.
- SVG’s are easy to read and write. It has syntax like HTML.
- Styling can be done on SVG’s using id’s and classes.
- 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.