Convert an Image to Base64

Get the text form of an image for embedding in HTML, CSS, email templates or JSON — as a raw Base64 string, a data URI, an img tag or a CSS rule, each with a copy button. Paste Base64 back in to decode it. All on your device.

Spec checkBytes → Base64 textAWAITING FILE
Drop your image hereor tap to choose — any image or SVG

Processing on your device…

100% private — this tool runs in your browser. Your file is never uploaded to any server.

How it works

Base64 represents binary bytes as plain text using 64 safe characters, which lets an image live inside a text file: a data URI (data:image/png;base64,…) can be dropped straight into an img src or a CSS background so the page needs no extra request. The cost is size — Base64 is about 33% larger than the original file — so it suits small icons, logos and email images rather than large photos. This tool reads the file bytes and encodes them without re-compressing, so the decoded result is byte-for-byte your original. The decoder below the drop zone does the reverse: paste a data URI or raw Base64 and it rebuilds the image for preview and download, detecting the format from the bytes if no MIME type is given.

Step by step

Add your image

Drop any image or SVG, or tap to choose.

Convert

The bytes are encoded on your device — no re-compression.

Copy

Grab the data URI, raw Base64, an img tag or a CSS rule with one click.

Decode (optional)

Paste Base64 into the lower box to turn it back into a downloadable image.

Frequently asked questions

What is the difference between Base64 and a data URI?

Raw Base64 is just the encoded bytes. A data URI wraps it with a prefix that states the MIME type — data:image/png;base64, — which browsers need to display it directly in an img tag or CSS.

When should I embed an image as Base64?

For small assets — icons, logos, tracking pixels, email signatures — where saving an HTTP request matters more than the 33% size increase. For photos, link to a normal file instead.

Does converting to Base64 lose quality?

No. The file bytes are encoded exactly as they are; decoding returns the identical file. Nothing is re-compressed.

Why is the Base64 bigger than my image?

Encoding three bytes as four characters adds about 33%. That is inherent to Base64 and applies to every tool, not just this one.

How do I decode Base64 back to an image?

Paste the string — with or without the data: prefix — into the decode box and press Decode. The image previews and downloads with the correct extension.

Can I convert an SVG to Base64?

Yes. SVG files are accepted and produce a data:image/svg+xml;base64 URI that works in img tags and CSS.

Is my image uploaded?

No. Reading and encoding happen in your browser via the FileReader API; nothing is transmitted, and the Base64 text exists only in your tab until you copy it.

Is there a size limit?

Only your browser’s memory. Very large images produce very long strings that are slow to paste into editors — another reason to reserve Base64 for small files.

Related tools