SVG Encoder

A Data URI lets you embed an SVG in CSS without a separate HTTP request. Useful for small icons — fewer requests and faster loading. The downside is that it can't be cached separately.

For small SVGs (icons up to 1–2 KB). For larger images, use separate files—caching and Brotli compression work better.

Removes spaces, line breaks, and comments. Reduces size by 10–30%. Doesn't affect how the code displays. Recommended before encoding.

Copy the generated Data URI and use it in url(): background: url(data:image/svg+xml;base64,...). It works in all modern browsers.

Data URIs in CSS are limited by line length. For SVGs larger than 10–20 KB, an external file or SVG sprite is preferable.