What is the difference between SVG and CSS for graphics

SVG, CSS, graphics, vector graphics, styling, scalability, animation
SVG and CSS are both essential tools for creating graphics on the web. SVG (Scalable Vector Graphics) is an XML-based format that allows for the creation of scalable and high-quality graphics, while CSS (Cascading Style Sheets) is primarily used for styling HTML elements. Each has its use cases and advantages in web design.
<svg width="100" height="100"> <circle cx="50" cy="50" r="40" stroke="black" stroke-width="2" fill="red"/> </svg> <style> .circle { fill: blue; transition: fill 0.5s; } .circle:hover { fill: green; } </style>

SVG CSS graphics vector graphics styling scalability animation