What is SVG?
Scalable Vector Graphics (SVG) is an XML-based format for two-dimensional vector graphics, text, styling, animation, and interactivity. Its geometric elements can scale without raster-resolution loss.
How SVG works
An SVG document is an XML tree of shapes, paths, text, paint rules, transforms, and references that a renderer resolves into a two-dimensional scene. Geometry remains editable and resolution-independent, although embedded raster images and filter effects still have finite sampling costs. SVG can be used as an image resource or integrated into a document, and those modes expose different scripting, styling, and linking behavior. It fits authoring, optimization, delivery, and raster-derivative generation for diagrams, icons, and illustrations.
A parser reads the file structure, identifies contained streams and metadata, and exposes them to a decoder or application. Conversion usually decodes the source representation and writes compatible information into a different structure or encoding.
A format may describe a container, a bitstream, or both, and the filename extension can be misleading. Evaluate decoding support, metadata, transparency, color, timing, patents, and archival needs before choosing an output.
Key facts
- 1An SVG’s `viewBox` establishes its internal coordinate system independently of displayed width and height; incorrect values can crop artwork or add unintended whitespace at every rendered size.
- 2External-file SVG used through an image element is more isolated than inline SVG in the document tree, so CSS inheritance, scripting, links, and accessibility behavior differ by embedding method.
- 3Text can remain selectable and searchable, but rendering depends on font availability unless fonts are embedded or glyphs are converted to paths, which sacrifices textual semantics.
When SVG matters
Use SVG for resolution-independent icons, logos, and diagrams when browser or tool support matches the required features. Sanitize untrusted files because SVG can contain scripts, links, and other active content.
- Accepting heterogeneous uploads while producing a controlled set of delivery formats.
- Moving assets between cameras, editors, browsers, archives, and downstream APIs.
- Separating long-lived source files from compact derivatives optimized for a particular channel.
Working with file formats at scale
Guidance that holds across every file formats term in this glossary, not just SVG.
What you gain
- A suitable format preserves the properties a workflow actually needs.
- Standardized structures allow files to move between compatible tools and systems.
- Format conversion can improve delivery size, editability, or long-term accessibility.
What it costs
- Modern formats can save bandwidth but may need fallbacks for older clients and production tools.
- Converting to a simpler format can discard transparency, animation, metadata, color precision, or editability.
- Archival suitability, browser support, and editing support often favor different choices.
Answer these before production
- 1Inspect the detected container, codec, MIME type, and magic bytes instead of trusting a suffix.
- 2Verify decoder support and preserve metadata, color, transparency, or timing when required.
- 3Retain the source when the chosen delivery format is lossy or tied to current software.
How Transloadit helps with SVG
When SVG is relevant to your workflow, you can hand the surrounding file formats work to Transloadit instead of maintaining the processing stack yourself. Transloadit detects file and MIME information, filters inputs, and converts images, audio, video, and documents into formats suited to browsers, applications, archives, and downstream services.
Support for a specific codec, container, parameter, or combination can vary by Robot and processing stack. Check the linked documentation for the exact inputs and outputs available for your use case.