Overview
SVG (Scalable Vector Graphics) defines vector-based graphics in XML format. Unlike raster formats (like JPEG or PNG), SVGs are composed of paths and shapes, allowing them to be scaled to any size without losing quality.
Key Features
- Scalability: Looks sharp at any resolution or zoom level.
- DOM Integration: SVG elements are part of the document's DOM and can be styled with CSS and manipulated with JavaScript.
- Small File Size: Often much smaller than equivalent raster images for simple graphics and icons.
- Accessibility: Can contain text and descriptions, making them more accessible to screen readers.
Use Cases
- Icons and logos.
- Illustrations and diagrams.
- Interactive maps and data visualizations (e.g., D3.js).