Key facts
- MIME type image/svg+xml; the file is XML text with an <svg> root element. Gzipped SVG uses .svgz.
- Describes shapes, paths, text and gradients rather than pixels, so file size depends on complexity, not resolution.
- Supports CSS styling, animation and scripts, which is why untrusted SVG uploads can be an XSS risk.
- Exported by Figma, Illustrator, Inkscape and icon libraries; often optimized with SVGO.
How to open a .svg file
Open it in any browser to view it, edit it in Inkscape (free) or Illustrator, or open it in VS Code or Notepad to edit the XML directly.
Quick Look and Safari display SVG; edit it in Inkscape, Illustrator, Figma or any text editor.
View it in a browser or image viewer and edit in Inkscape. Convert to PNG with rsvg-convert -w 512 logo.svg -o logo.png or inkscape logo.svg --export-type=png.
Common problems and fixes
- SVG shows as broken image or downloads instead of displaying
- The server is sending the wrong Content-Type. Serve .svg as image/svg+xml (for example AddType image/svg+xml .svg in Apache) and check the file starts with valid XML.
- SVG does not scale or is cropped
- The file has fixed width/height but no viewBox. Add a viewBox matching the drawing bounds (e.g. viewBox="0 0 24 24") and size it with CSS.
- Browser reports XML parsing error
- The markup is malformed: an unclosed tag, an unescaped & or a missing namespace. Validate it as XML and fix the reported line.
- Uploaded SVG could run scripts on my site
- SVG can contain <script> and event handlers. Sanitize uploads (for example with DOMPurify or a server-side sanitizer), or serve user SVGs only via <img> or from a separate domain.
Often converted to or from: PNG, PDF, ICO, WebP, EPS