100% in your browser
atob + Blob — nothing uploaded
Base64 to Image paste, preview, download.
Got a long base64 string and no idea what picture is hiding inside it? Paste it in the box above, with or without the data:image/...;base64,... prefix, and the real image appears so you can preview it and download it as a PNG or JPG. Everything runs in your browser, so the string never leaves your device and the result shows up instantly. If you then want a shareable https link for the recovered picture, you can pass it to the main uploader.
Base64 to image at a glance
- Price
- Free
- Sign-up
- Not required
- Input
- Base64 data URI or raw Base64
- Max size
- 50 MB
- Output
- Image file (PNG/JPG) + optional link
How to decode base64 to an image
Paste base64 or data URI
Drop in either the full data:image/...;base64,... string or just the raw base64 payload. The string can come from CSS, an API response, a database field or another tool - it all works.
Click Decode
The picture renders right away in your browser. A full data URI keeps its own MIME type; a bare base64 chunk is treated as PNG by default.
Download or host it
Save the file to your device as a normal image, or send it to the uploader if you want a short https link to share.
Why decode base64 here
Nothing leaves your browser
Decoding is a local atob() and Blob step. The string is never sent to a server, which matters when it came from private config or an internal API.
Check what a data URI really is
Inline data URIs are unreadable by eye. Paste one here to confirm it holds the image you expect before you ship it in code or email.
Get a normal file back
Once decoded you have a regular PNG, JPG, GIF, WebP or SVG you can open, edit or upload anywhere - no special viewer needed.
Works offline and instantly
There's no upload wait and no internet round trip. Open the page once and it keeps decoding even with the connection dropped.
Base64 vs a hosted URL
A base64 data URI and a hosted image URL both put a picture into a page, but they behave very differently. One inlines the bytes as text, the other points at a file on a server. Here's when each makes sense.
| Method | Needs hosting | Good for | Downsides |
|---|---|---|---|
| Base64 data URI | No hosting | Tiny inline assets, single-file HTML, email, code | Long unreadable string, about 33% larger, not shareable as a link, not cached separately |
| Hosted image URL | Needs a host | Sharing, large images, pictures reused across pages | One extra network request, but the file is short, cacheable and easy to paste |
What is a base64 image?
A base64 image is a picture encoded as plain text so it can be dropped straight into code, CSS or an email instead of living in a separate file. The text usually starts with a data URI prefix like data:image/png;base64, followed by a long run of letters, digits, plus and slash characters. A browser reads that string, turns it back into the original bytes and shows the picture. Nothing about the image changes - it's the same pixels, just written in a format that travels inside text. Decoding simply reverses the process and hands you the file again.
When to use base64 vs a URL
Base64 is handy for tiny, fixed assets: a small icon in a stylesheet, a logo in an HTML email, or a single-file page with no external requests. Because the bytes live inside the document, there's no extra request and nothing to host. For anything bigger or anything you want to share, a hosted URL wins. A link is short, you can paste it into a chat or a post, the file caches on its own, and the same image can be reused across many pages without bloating each one. As a rough rule, inline below a few kilobytes and link above it.
Why base64 makes files about 33% bigger
Base64 maps every 3 bytes of binary data onto 4 ASCII characters. Each character it uses is itself one byte of text, so 3 bytes in become 4 bytes out - a jump of roughly one third. That's the trade for making binary safe to store and send as plain text: you accept about 33% more size. On a 2 KB icon the overhead is trivial, but on a 2 MB photo it adds hundreds of kilobytes and makes the surrounding code hard to read. This is the main reason large images belong in real files behind a URL rather than inlined as base64.
When people decode a base64 string
A base64 image can land in your lap from all sorts of places. These are the common ones:
From an API or database
Some APIs and DB columns store images as base64 text. Paste the value here to pull the actual picture out and save it as a file.
From CSS or HTML source
Inline background-image: url(data:...) rules and embedded <img src=data:...> tags hide a real image. Decode it to inspect or reuse the asset.
From an email or export
Email source and some app exports embed images as base64. Recover them here instead of hunting for the original file.
Base64 to image FAQ
How do I convert a base64 string into an image?
Paste the string into the box above and click Decode. The picture appears right away and you can download it as a PNG or JPG. It works with or without the data:image prefix.
Do I need the data: prefix?
No. A full data URI keeps its embedded MIME type, so the output matches the original format. A raw base64 chunk with no prefix is decoded as PNG by default, which is fine for most cases.
Is anything uploaded when I decode?
No. The decode happens locally with the browser's atob() and the Blob constructor. The string never goes to a server, so it's safe for private or internal data.
What image formats can I get out?
Whatever was encoded: PNG, JPG, GIF, WebP or SVG. A full data URI tells the decoder the exact type; a bare payload comes out as PNG.
Why is nothing happening after I paste?
Usually there are invisible line breaks or spaces in the string. Remove them, or paste as plain text, then decode again. A truncated string that's missing its end will also fail.
Is there a size limit on the string?
A textarea handles several megabytes of base64 fine. Past about 10 MB of text the browser slows down, which lines up with a roughly 7 MB original image.
My transparent PNG looks blank - is it broken?
Probably not. A PNG with full transparency can look empty against a white page. Download it and open it over a dark or checkered background to confirm the pixels are there.
Does it handle URL-safe base64?
Yes. URL-safe base64 swaps + for - and / for _. The decoder normalizes those back before converting, so strings from URLs and tokens still work.
Can I decode a data URI that holds an SVG?
Yes. SVG data URIs preview correctly. If the SVG was URL-encoded rather than base64-encoded, open the result in a new tab to see it render.
Does decoding change or compress the image?
No. Decoding is exact and lossless - you get back the same bytes that were encoded. There's no resizing, re-compression or watermark.
Can I get a shareable link for the decoded image?
Yes. After you save the file, send it to the main uploader to get a direct https link that embeds in Discord, Reddit, forums and email. Base64 itself can't be shared as a link.
Why would an image be stored as base64 in the first place?
To keep it inside text. APIs, JSON config, CSS, single-file HTML and email all benefit from embedding a small image directly instead of pointing at a separate file. The cost is the larger size and unreadable string.
Related image tools
Host the decoded image?
Upload the picture you just recovered to get a permanent, shareable https link in seconds. No sign-up needed.
Try the main uploader