What Is This?
The image/svg+xml MIME type indicates that the content is an SVG (Scalable Vector Graphics) image. Unlike raster formats (JPEG, PNG), SVG describes images using XML-based vector mathematics, making them resolution-independent and infinitely scalable without quality loss. SVGs can also be styled with CSS and manipulated with JavaScript.
Common Uses
Common Use
Icons, logos, and illustrations
Common Use
Data visualizations and charts
Common Use
Animated graphics and infographics
Common Use
Responsive images that must look sharp at any size
Examples
Serve files with the image/svg+xml MIME type:
# Nginx
location ~ \.svg$ {
add_header Content-Type "image/svg+xml";
}
# Apache
AddType image/svg+xml .svgUse this MIME type in HTML or HTTP:
Content-Type: image/svg+xml <!-- HTML reference --> <link rel="preload" href="file.svg" as="fetch" crossorigin>
Related Entries
More from this reference:
image/png
The MIME type for PNG (Portable Network Graphics) image files with lossless compression.
image/jpeg
The MIME type for JPEG image files using lossy compression for photographs.
image/gif
The MIME type for GIF images supporting animation and transparency.
image/webp
The modern MIME type for WebP images offering superior compression for both lossy and lossless encoding.
image/avif
The next-generation MIME type for AVIF images with advanced compression based on AV1 video codec.
Frequently Asked Questions
Should I use .svg or .svgz extension?
Use .svg for standard SVG files. .svgz is a gzip-compressed SVG format that reduces file size but is less commonly supported. Most servers can gzip SVG on-the-fly for transfer.
Can I embed SVG directly in HTML?
Yes. SVG can be inlined directly in HTML without needing a separate file or MIME type. Inline SVGs can be styled with CSS and scripted with JavaScript, making them powerful for interactive graphics.