Do I need the "data:" prefix on my input?

No. You can paste raw Base64 with no prefix and the MIME type will be detected from the file's magic bytes. The tool also accepts a full data URI, a CSS url(...) value, or an entire tag, and it tells you which form it recognised.

How does it know the image type without a MIME header?

It inspects the first few decoded bytes (the magic number) — for example the PNG signature or the JPEG start-of-image marker — and infers the format. When the type is sniffed rather than declared, a "sniffed" badge appears next to the detected type.

Can I see the SVG source from a Base64 string?

Yes. SVGs are text, so when the payload decodes to an SVG the tool offers a "Show decoded SVG source" section that displays the underlying markup. You can also pipe the cleaned raw Base64 into the Base64 decoder to read it.

What can I do with the decoded image?

Download it as a file with the correct extension, copy a normalized data URI to your clipboard, or open it in a new browser tab. The stats panel also reports the decoded size, Base64 size, dimensions, and aspect ratio.

Is the decoding done on a server?

No. The Base64 is decoded entirely in your browser using built-in APIs, and the image is rendered from an in-memory blob. Nothing is uploaded, so the tool is safe for private images.

Why does the preview show a checkerboard behind my image?

The checkerboard indicates transparency. PNG, WebP, SVG, and similar formats can have transparent areas, and the pattern lets you see through them so you can confirm the alpha channel decoded correctly.

Base64 to Image

Decode Base64 or a data URI back into an image live — paste a raw string, data URI, CSS url() or an <img> tag, then preview, inspect, and download. MIME type is auto-detected.

About this ToolHow it works, benefits & use cases

Decode a Base64 string back into a viewable, downloadable image — and you do not need to clean it up first. Base64 to Image accepts a full data URI, a raw Base64 payload with no prefix, a CSS url(...) value, or an entire <img> tag, extracts the payload, and tells you what it detected the source as. If there is no MIME type, it sniffs one from the file's magic bytes and flags that it was inferred. You get a checkerboard preview plus stats: detected type, intrinsic dimensions, aspect ratio, decoded byte size, the Base64 size, and where the payload came from. From there you can download the image with the correct extension, copy a clean normalized data URI, or open it in a new tab. SVG payloads decode to text, so the tool can reveal the underlying SVG source, and the cleaned raw Base64 is available to pipe into a Base64 decoder. It all runs locally in your browser — nothing is uploaded.

How to Use

1Paste your Base64 into the input — a data URI, raw Base64, a CSS url(), or a full <img> tag all work. Or click "Try a sample".
2Watch the preview render and review the detected type, dimensions, aspect ratio, and sizes.
3Download the decoded image (with the right extension), "Copy data URI" for a normalized string, or "Open in tab".
4For an SVG payload, expand "Show decoded SVG source" to read the markup.
5Use the "Raw Base64" output to copy the cleaned payload or pipe it into the Base64 decoder.

Key Benefits

Accepts data URIs, raw Base64, CSS url(), and full <img> tags
Auto-detects the MIME type, sniffing from magic bytes when absent
Live preview plus type, dimensions, aspect ratio, and size stats
Download with the correct extension, copy a clean data URI, or open in a tab
Reveals decoded SVG source for text-based payloads
Outputs cleaned raw Base64 you can pipe into a decoder
Decodes locally in your browser — nothing is uploaded

Common Use Cases

Previewing a data URI pulled from CSS or an API response
Saving an inlined image out of source code as a real file
Recovering an image from a copied <img> tag or CSS background
Inspecting the SVG markup hidden inside a Base64 data URI
Verifying a raw Base64 string actually decodes to a valid image

Base64 input

Paste a data URI, raw Base64, a CSS url(), or a full <img> tag — messy is fine.

Was this tool helpful?

Share Your Experience

Help others discover this tool!

Share on