Base64 to image converter

Paste a Base64 string or a data: URI to see the image, its type and size, and download it as a file. It also accepts JSON strings, CSS url() values and URL-safe Base64. Free, and nothing leaves your browser.

Paste a Base64 string or a data URI

Image to Base64

Image file (PNG, JPG, WebP, GIF, SVG, ICO)

No file yet.

Output

Format

When to inline an image as Base64

Base64 makes a file about 33% bigger, and an inlined image can't be cached separately from the page. So inline only small things: icons, tiny logos, placeholders, and images inside HTML emails, single-file reports or JSON payloads. For anything over a few KB, a normal image URL is faster. This tool shows the encoded size so you can judge.

Need a screenshot of a web page as Base64?

The Shotmint API renders any URL or HTML in real Chromium and returns a PNG, JPEG or WebP. Pipe it through base64 to get a data URI for an email, a report or an AI model that takes images as Base64:

echo "data:image/png;base64,$(curl -s "https://shotmint.creasework.com/v1/screenshot?url=https://example.com&width=1200&height=630" -H "X-API-Key: YOUR_KEY" | base64 | tr -d '\n')" > shot.txt

In Node, the same thing is Buffer.from(await res.arrayBuffer()).toString('base64'). Each render is 1 credit. €5 buys 2,000 with no subscription, and credits never expire.

Get 25 free renders a month Read the docs

FAQ

Is my image uploaded? No. The browser reads the file locally and encodes it. Nothing is sent to a server.

Why won't my Base64 decode to an image? The usual causes: the string was cut off (a copy from a log or a truncated JSON field), it is a different file type (the decoder tells you if it is a PDF), or it has stray characters. Spaces, line breaks, surrounding quotes, a CSS url() and URL-safe Base64 (- and _) are all handled for you.

What is the difference between Base64 and a data URI? Base64 is just the encoded bytes. A data URI adds the type in front (data:image/png;base64,) so browsers can use it anywhere a URL goes: src, url() in CSS, or the address bar.

Do data URIs work in email? Many webmail clients, including Gmail, block data: images. For email, attach the image with a Content-ID (cid:) or host it at a URL.

Should SVG be Base64? Not always. For CSS, a URL-encoded SVG (data:image/svg+xml,%3Csvg...) is usually shorter than Base64. To turn an SVG into a PNG first, use the SVG to PNG converter.

Base64 to image converter

Image to Base64

Output

When to inline an image as Base64

Need a screenshot of a web page as Base64?

FAQ

Related tools