Vector SVG to Data URI Code Converter

Developer

Drop an SVG, get inline-ready data URI code instantly.

Your SVG

Drop a .svg file, or paste the XML directly below.

Drag & drop an .svg file, or click to browse

Strips comments, doctype, and extra whitespace

Output

Choose the format you need, then copy.

Add an SVG to see the preview and generated code.

About this tool

Drag and drop an .svg file or paste its XML directly, and instantly get a clean data:image/svg+xml;base64 URI — plus a URL-encoded alternative, a ready-to-use CSS background-image snippet, and an HTML img tag, all with live preview and size comparisons.

How to use Vector SVG to Data URI Code Converter

  1. 1

    Drag and drop an .svg file onto the drop zone, or paste raw SVG XML into the text box.

  2. 2

    Toggle "Minify before encoding" to strip comments and extra whitespace, and see the size difference.

  3. 3

    Check the live preview to confirm it rendered correctly.

  4. 4

    Switch between Base64, URL-encoded, CSS, and HTML tabs, then copy whichever format you need.

Frequently asked questions