SVG to Data URI
Encode an SVG into a URL-encoded or base64 data URI for CSS or img src.
Preview
URL-encoded (recommended for CSS)
Base64
CSS background
Inlining SVG as a data URI
A data URI embeds an entire SVG directly into your CSS or HTML, removing a network request — perfect for small icons, backgrounds, and bullets. The URL-encoded form is usually smaller and more readable than base64 and is the recommended choice for CSS background-image; the base64 form is handy when a tool requires it. Both are generated locally — your SVG never leaves your browser.
Working with raster images or other strings? The Base64 encoder and URL encoder cover the general cases.
Related Converters tools
JSON to YAML
Convert JSON into clean, readable YAML instantly.
YAML to JSON
Convert YAML configuration into valid JSON.
JSON to CSV
Flatten a JSON array of objects into CSV rows.
CSV to JSON
Parse CSV with headers into a JSON array of objects.
JSON to XML
Convert JSON structures into nested XML markup.
JSON Minifier
Strip whitespace to produce compact JSON.
JSON to TypeScript
Generate TypeScript interfaces from a JSON sample.
JSON to SQL
Turn a JSON array of objects into SQL INSERT statements.