Image to Base64 Converter
Encode any image to a Base64 data URI for inline CSS/HTML, or decode a data URI back to an image.
Quick answer: Encode any image to a Base64 data URI for inline CSS/HTML, or decode a data URI back to an image.
Last updated
Frequently asked questions
- When should I inline an image as Base64?
- Use it for sub-2 KB images that need to ship with a single CSS file (e.g. icons in an email template, small SVG fallbacks) or for offline single-file HTML demos. Above 5 KB, a normal <code><img></code> request is faster because it can be cached.
- Will the Base64 version be larger than the original?
- Yes — Base64 adds about 33% overhead. A 1 KB image becomes a 1.34 KB string. That's fine for tiny assets but wasteful for large ones.
- Does it work with SVG?
- Yes, but for SVG you usually want to leave it as raw SVG markup (or URL-encode it) instead of Base64 — both are usually smaller and editable later.
- Can I paste a data URI to recover the file?
- Yes — the decode panel accepts <code>data:image/...</code> URIs and gives you a downloadable file plus a live preview.
- Are my images uploaded?
- No. FileReader reads bytes locally and the encoded string never leaves your browser.