SVG

Summary

Scalable Vector Graphics — an XML-based format for resolution-independent icons, illustrations and data visualizations that stay crisp at any zoom level. Because SVG is vector-based, it is particularly useful for icons, logos, diagrams, and illustrations that must remain sharp at different sizes and resolutions.

• 1Inline an SVG icon directly in HTML and style it with CSS `fill`. Validate your understanding by applying it in a small practical example.
• 2Try animating an SVG path with CSS or a small script. Inspect the result in DevTools or the console and explain what you observed.
• 3Compare SVG vs PNG/JPG — when each is the right choice.