Free Image to Base64 Encoder & Decoder
Base64 encoding converts binary image data into plain ASCII text, letting you embed pictures directly inside CSS files (background-image: url(data:...)), HTML documents, JSON payloads, and emails — anywhere a separate image file is inconvenient. This free tool encodes any image to a data URI and decodes data URIs back to downloadable files, entirely in your browser with the FileReader API.
How to Encode and Decode
- To encode: choose an image file. Its full
data:[mime];base64,...string appears instantly with original-vs-encoded size stats. - Copy and embed — paste the string into CSS, an
<img src>, or a JSON field. - To decode: paste any image data URI below, click Decode, preview the result, and download the restored file.
The 33% Rule: When Base64 Helps and Hurts
Base64 inflates data by roughly one-third (every 3 bytes become 4 characters), so it only pays off for small assets: icons, tiny patterns, and single-use graphics where eliminating an HTTP request beats the size penalty. For large photos, linked files with caching win every time. Also note that base64 text in HTML blocks rendering the same way the image would — embed sparingly above the fold.
What is a data URI?
A data URI is a URL scheme (data:[mediatype][;base64],data) that carries file contents inline instead of pointing at a server. Browsers have supported image data URIs for over a decade.
Can Base64 be reversed to the exact image?
Yes — encoding is lossless. Decoding restores the identical bytes, which is why this page offers a full decoder with dimension readout and download.
Is my image uploaded?
No. FileReader reads the file into memory locally; the encoded string never leaves your machine.
Related Tools
For text (not files), use the Base64 Text Converter. Shrink images before encoding with the Image Compressor, and convert formats with the WebP Converter.