Image ↔ Base64
Convert images to Data URI strings or decode Base64 strings to images.
About Image <-> Base64 conversion
Embedding an image directly into HTML or CSS as a Base64 data: URL avoids an HTTP request, which is a meaningful win for tiny icons that must appear above the fold. It is also handy for inlining images into emails, into PDFs, or into JSON payloads sent over WebSocket. The trade-off is roughly a 33% size penalty and zero browser-cache reuse, so reserve the technique for small assets.
This tool encodes an image you drop onto the page into a copy-pasteable data URL, and also decodes a data URL back into a downloadable file. Encoding happens entirely in your browser via the FileReader API.
How to use
- Drop an image onto the upload zone, or click to browse.
- The Base64 representation appears beside the preview.
- Copy the data URL or download the encoded text.
- To decode, paste a data URL into the input — the rendered image appears below.
Common use cases
- Inlining small icons in stylesheets to remove an HTTP request.
- Including images in HTML emails where remote attachments may be blocked.
- Embedding charts in JSON payloads for offline-first applications.
- Pasting a screenshot into a markdown-driven note system that does not support attachments.
Frequently asked questions
When should I not inline an image?
Anything larger than a few kilobytes is better off as a regular asset. Inlined images bypass HTTP caching, so the same file is re-downloaded on every page load.
What MIME types are supported?
Anything the browser can read — JPEG, PNG, GIF, WebP, AVIF and SVG. The MIME type is preserved in the resulting data URL prefix.
Is the image uploaded to a server?
No. Encoding is performed by the browser itself; the bytes never leave the page.
Advertisement