SVG to Data URI Converter

Embedding an SVG directly into CSS or HTML — instead of linking a separate file — avoids an extra HTTP request, which matters for small icons and background graphics. This tool converts pasted or uploaded SVG code into a data URI, generating both a Base64-encoded version and a URL-encoded version, and tells you which one produces the smaller output for your specific SVG.

Alongside the raw data URI, it also generates a ready-to-copy CSS background-image rule and an HTML <img> tag, so you can paste the result straight into your code.

Base64 vs. URL encoding

URL encoding is usually more compact for simple SVGs, while Base64 can be smaller for SVGs with lots of special characters — this tool measures both and shows you the winner instead of making you guess.