Base64 to Image Converter
Decode a Base64 string or data URI back into an image in your browser. Preview, read dimensions & MIME, then download as PNG, JPG, GIF, SVG. No upload.
Drop an image here, paste it, or click to browse
PNG · JPG · GIF · WebP · SVG · ICO · BMP — converted entirely in your browser
What is Base64 to Image Decoding?
Base64 to image decoding is the reverse of encoding: it takes a string of printable ASCII characters from the Base64 alphabet (A–Z, a–z, 0–9, + and /) and reconstructs the original binary image the string represents. Every group of four Base64 characters maps back to three bytes, and one or two trailing = characters indicate padding. The result is the exact file that was originally encoded — a PNG comes back as a PNG, a JPEG as a JPEG — with no loss, recompression, or resizing.
These strings show up wherever an image has been inlined as text. A data URI in a stylesheet (background-image: url(data:image/png;base64,…)), an img src in HTML, a thumbnail field in a JSON API response, an embedded logo in HTML email, or an asset bundled into a config file are all Base64 images waiting to be decoded. When you are debugging, auditing, or extracting such an asset, you need to see what the opaque string actually is and pull it out as a real file — which is exactly what this decoder does.
The operation is purely mechanical and requires no key, because Base64 is an encoding rather than encryption. That also means it offers no security: anyone with the string can recover the image instantly. Base64 exists solely to let binary data pass through channels designed for text — HTML, JSON, URLs, email headers — without being corrupted by control characters or delimiters. Decoding simply undoes that text-safe packaging and hands you back the original bytes.
This tool performs the entire decode locally in your browser. It tolerates the messiness of real-world strings — missing data: prefixes, line wrapping at 76 characters, stray whitespace from copy-paste — and infers the image format from the data's magic bytes when the MIME type is not declared. To create these strings in the first place, see the companion Image to Base64 encoder.
// A Base64 PNG payload (no prefix) iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAC0lEQVR42mNk+M9QDwADhgGAWjR9awAAAABJRU5ErkJggg== // The decoder infers the format from the leading bytes: // iVBORw0KGgo → PNG // /9j/ → JPEG // R0lGOD → GIF // UklGR → WebP // PHN2Zy → SVG (<svg) // Reconstructed as a real file, downloadable as image.png // (1 × 1 transparent PNG, 68 bytes — lossless round trip)
Key Features
Prefix-Optional Input
Paste a complete data URI or just the bare Base64 payload — the decoder handles both. When there is no data: prefix, it infers the MIME type from the image's magic bytes so the preview and download are still correct.
Instant Local Preview
The decoded image renders immediately against a checkerboard background, so transparent PNGs and partial-alpha graphics are clearly visible. Everything happens in your browser with zero network requests.
Dimensions, MIME & Size Readout
Beyond the preview, the tool reports the decoded pixel dimensions, the detected MIME type, and the reconstructed byte size — enough to verify you decoded the right asset before downloading it.
Whitespace-Tolerant Decoding
Strings wrapped at 76 characters per RFC 2045, or copied with stray spaces and line breaks, are cleaned automatically. The decoder strips all whitespace before decoding, so real-world copy-paste just works.
Lossless Download
Download rebuilds the exact original bytes and saves them with the matching extension — .png, .jpg, .gif, .webp, .svg, .ico, .bmp. No recompression or conversion: the file is identical to the one that was encoded.
Built-in Encoder
The Image → Base64 tab reverses direction: drop, paste, or browse to an image and get Base64, data URI, HTML, CSS, Markdown, and JSON output with size metrics and inlining advice — a complete round-trip in one tool.
Examples
Decode a PNG data URI
data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAC0lEQVR42mNk+M9QDwADhgGAWjR9awAAAABJRU5ErkJggg==
1 × 1 PNG, transparent — preview rendered, downloadable as .png
Paste a full data URI and the tool renders the image immediately, reads its real dimensions and MIME type, and lets you download the reconstructed file.
Raw Base64 with no prefix
/9j/4AAQSkZJRgABAQEAYABgAAD…
JPEG detected from magic bytes — preview + download as .jpg
No data: prefix? No problem. The decoder inspects the leading characters, recognises the JPEG signature (/9j/), and builds a correct data URI for you so the image still renders.
Chunked (line-wrapped) Base64
iVBORw0KGgoAAAANS UhEUgAAAAEAAAAB CAYAAAA…
Whitespace stripped automatically — valid PNG decoded
Strings wrapped at 76 characters (RFC 2045) or copied with stray line breaks are cleaned automatically: the decoder removes all whitespace before decoding.
How to Convert Base64 to an Image
- 1
Paste the Base64 string
Drop in a full data URI or just the raw Base64 payload. The decoder strips whitespace and line breaks automatically and accepts input with or without the data: prefix.
- 2
Check the preview and metadata
The image renders instantly against a checkerboard so transparency is visible. The tool shows the decoded dimensions, MIME type, and byte size — inferring the format from magic bytes when no prefix is present.
- 3
Download the image
Click Download to save the reconstructed file with the correct extension. Decoding is lossless, so the result is byte-for-byte identical to the original encoded image.
Common Pitfalls
Truncated String (Lost Padding)
Base64 image strings end in zero, one, or two = characters. A copy that stops short — dropping the padding or the last few characters — cannot be decoded and shows an error. Re-copy the entire value to fix it.
…WjR9awAAAABJRU5ErkJggg // missing trailing == — fails to decode
…WjR9awAAAABJRU5ErkJggg== // complete with padding — decodes cleanly
Pasting Non-Image Data
Base64 can encode any bytes, not just images. If you paste an encoded PDF, ZIP, or plain text, the string decodes but does not render as a picture. The tool reports that the data is not valid image data. Confirm the source really is an image before decoding.
JVBERi0xLjcN… // this is a Base64 PDF (%PDF header), not an image
iVBORw0KGgo… // this is a Base64 PNG — renders correctly
Including the Wrapping Code
When copying from CSS or HTML, it is easy to grab the surrounding syntax — url("…"), src="…", or quotes — along with the data URI. Stray wrapper characters can break decoding. Copy only the data:…;base64,… value (or the bare payload), not the code around it.
url("data:image/png;base64,iVBORw0KGgo…")
// the url(" and ") are not part of the data data:image/png;base64,iVBORw0KGgo… // just the data URI
Double-Encoded or URL-Encoded Strings
Occasionally a data URI is URL-encoded (%2B instead of +, %2F instead of /) or wrapped in another encoding layer. Decode that layer first. Our URL Decoder reverses percent-encoding so you are left with clean Base64 to paste here.
data:image/png;base64,iVBORw0KGgo%2B%2F… // %2B / %2F are URL-encoded + and /
data:image/png;base64,iVBORw0KGgo+/… // URL-decode first, then decode the image
Common Use Cases
- Extract an asset from a data URI
- Found an image inlined in a stylesheet or HTML as a data URI and need the actual file? Paste the string, confirm the preview, and download the original PNG, JPG, or SVG — no need to host or re-create it.
- Inspect an API response thumbnail
- An API returned a Base64 image field and you want to see what it is. Paste the payload to render it instantly, read its real dimensions and type, and save it for closer inspection or bug reports.
- Debug a broken inline image
- An embedded image isn't rendering on your page. Drop its Base64 here: if it previews correctly, the data is valid and the problem is in your markup or MIME type; if it fails, the string itself is truncated or corrupt.
- Recover an image from a config or theme file
- Build tools and theme bundles often inline icons and logos as Base64. Decode the string to pull the asset back out as a normal file you can edit, re-export, or reuse elsewhere.
- Verify a build-tool output
- A bundler or script generated a data URI and you want to confirm it is valid and correct before shipping. Decoding it here is the fastest visual check that the encoding step produced the image you expected.
- Convert Base64 back to a shareable file
- Someone sent you an image as a Base64 blob in a chat or document. Paste it, preview it, and download a real file you can open, attach, or upload normally.
Technical Details
- How Decoding Works
- The browser's built-in atob converts the Base64 payload into a binary string, which the tool copies byte-by-byte into a Uint8Array. That typed array is wrapped in a Blob tagged with the detected MIME type, and an object URL points the preview and the download link at it. Every group of four Base64 characters yields three bytes; trailing = padding marks the one- or two-byte remainder. The process is exact and lossless — the reconstructed bytes match the original file precisely.
- Magic-Byte Format Detection
- When the input has no data: prefix to declare a MIME type, the decoder identifies the format from the first few Base64 characters, which encode the file's signature bytes. iVBORw0KGgo decodes to the PNG header, /9j/ to the JPEG SOI marker, R0lGOD to GIF, UklGR to the RIFF/WebP container, PHN2Zy and PD94bWw to SVG's
- No Network, No Storage
- Decoding, preview, and download are all local. There is no fetch, no XMLHttpRequest, and no server round trip — the only network activity the page ever performs is loading itself. Pasted strings are held in memory for the lifetime of the page and discarded when you close or reload it. This is what makes the tool safe for confidential imagery and usable offline.
Best Practices
- Copy the Whole String, Including Padding
- A Base64 image string must be complete to decode. Make sure you copy every character, especially the trailing = or == padding — a value that ends mid-string will fail. If decoding fails, re-selecting and re-copying the full string is the first thing to try.
- Trust the Magic-Byte Detection for Prefixless Strings
- If you only have the raw payload, paste it as-is — there is no need to hand-build a data: prefix. The decoder infers the format from the leading bytes and assigns the correct MIME type and extension. Only add a prefix manually if you specifically need to override the detected type.
- Verify Dimensions Before Downloading
- Use the reported pixel dimensions and MIME type as a sanity check that you decoded the asset you intended — especially when pulling one string out of a file containing several. A 1×1 result, for instance, usually means you grabbed a tracking pixel rather than the image you wanted.
- Remember Base64 Is Not Secure
- Decoding requires no key, so never rely on Base64 to hide image content. If you received a string expecting it to be protected, it is not — anyone can decode it here in seconds. Real protection requires encryption and access control, not encoding.
- Re-encode Round Trips Losslessly
- Decoding then re-encoding the same image is lossless, so you can safely round-trip through both tabs to test a pipeline. If you need to shrink the asset, compress the decoded file with our Image Compressor before re-encoding it to a smaller data URI.
Frequently Asked Questions
What does this Base64 to Image converter do?
Is my Base64 data uploaded anywhere?
Do I need to include the data: prefix?
What image formats can it decode?
Why does my Base64 string fail to decode?
How do I save the decoded image as a PNG or JPG?
Is decoding Base64 the same as decrypting it?
Can it handle very long Base64 strings?
Where do these Base64 image strings come from?
Does decoding lose any quality?
Related Tools
View all tools →Base64 Decoder & Encoder
Encoding & Formatting
Decode and encode Base64 online for free. Real-time conversion with full UTF-8 and emoji support. 100% private — runs in your browser. No signup needed.
CSV to JSON Converter
Encoding & Formatting
Convert CSV to JSON in your browser. RFC 4180, type inference, header row, big-int safe. 100% private, no upload.
Image to Base64 Converter
Encoding & Formatting
Convert images to Base64 data URIs in your browser — PNG, JPG, GIF, WebP, SVG, ICO. Copy HTML, CSS, Markdown & JSON, with the exact size increase. 100% private, no upload.
JSON Diff & Compare
Encoding & Formatting
Compare two JSON files instantly in your browser. Side-by-side highlighting, RFC 6902 JSON Patch output, ignore noisy fields like timestamps and IDs. 100% private, no upload.
JSON Formatter & Validator
Encoding & Formatting
Format, validate and beautify JSON instantly in your browser. Free online tool with syntax validation, error detection, minify and one-click copy. 100% private.
JSON Schema Validator
Encoding & Formatting
Validate JSON against any JSON Schema instantly in your browser. Supports Draft 2020-12, 2019-09, and Draft-07 with path-precise error messages. 100% private — no upload, no account, free.