Base64 Image Encoding: A Web Developer's Complete Guide
Learn how Base64 image encoding works, when to use data URIs in HTML and CSS, and when to stick...
Read guidePaste a Base64 string or data URI and get the real image file back, ready to view and download. Works with or without the data:image prefix. It all happens in your browser, nothing is uploaded.
The screenshot is a real decode: a data URI pasted in, turned back into a viewable, downloadable image.
Drop in the string from page source, an API response, a CSS background or devtools. The prefix is optional; the tool reads it with or without data:image at the front.
Click Decode and the real image appears with its dimensions and format. Download it as a normal file. Everything happens on your device.

A Base64 string is an image hiding inside text, and you run into them more than you would expect: inline images in page source, CSS backgrounds written as data URIs, thumbnails embedded in an API response, or a blob dumped into a debugging log. On their own they are unreadable.
This tool turns any of them back into a real file you can open, save or re-use. Paste, decode, download. It is the exact reverse of the Image to Base64 tool.
A truncated copy, a stray space or a line break will fail to decode. Copy the whole string cleanly, from the first character to the last, and try again.
Base64 can encode any file, but this tool expects an image data URI. A string that decodes to a PDF or a zip will not display here.
You get back exactly what was encoded. If the original was small or low quality, the decoded file will be too; decoding cannot add detail.
No. Paste it either way. With the full data:image/jpeg;base64, prefix or just the raw string starting with something like /9j/ for JPEG or iVBORw0 for PNG, the tool handles both.
Whatever the data URI says: a data:image/jpeg gives a JPG, a data:image/png gives a PNG. If there is no prefix, it defaults to PNG.
Usually a stray space or line break, or a string that got cut off when you copied it. Grab the whole thing cleanly and try again. Valid characters are A to Z, a to z, 0 to 9, plus, slash and the equals padding.
Page source with inline images, CSS data-URI backgrounds, API responses with embedded thumbnails, and the output of devtools or debugging logs. This tool turns any of them back into a real file.
No. Decoding happens in your browser. Nothing is transmitted to a server, and it works offline.
The reverse: turn an image into a data URI.
Open toolShrink the decoded file if it is large.
Open toolChange the decoded image to another format.
Open toolResize the decoded image to what you need.
Open toolTrim the decoded image down.
Open toolConvert a decoded PNG to a smaller JPG.
Open toolSave the decoded image as a smaller WEBP.
Open toolInspect what a decoded photo carries.
Open toolLearn how Base64 image encoding works, when to use data URIs in HTML and CSS, and when to stick...
Read guideA complete guide to image SEO optimization. Learn about alt text, file names, compression, forma...
Read guideA comprehensive comparison of JPG, PNG, and WEBP image formats. Learn when to use each format fo...
Read guideYou drop a photo into a free online compressor, a bar fills up, and a smaller file comes back. S...
Read guide