Image to Base64 Converter

Turn any image into a Base64 data URI without uploading. Drag and drop a PNG, JPG, GIF, WebP or SVG and instantly get the raw data URI plus ready-to-paste HTML <img> and CSS background-image snippets. You also see the original size, the encoded size and the Base64 overhead, with a warning when a file is too big to inline. Need the reverse? Paste a data URI or Base64 string to preview the image and download it.

Image file Drag & drop an image here or click to browse — PNG, JPG, GIF, WebP, SVG

Everything runs in your browser — your image is never uploaded. Max 10 MB.

100% client-side. The file never leaves your device.

Your result will appear here

Choose an image to get its Base64 data URI, or paste one to preview and download.

How to use

Open the Image → Base64 tab and drag an image onto the drop zone, or click to browse.
Wait a moment while the image is encoded entirely in your browser — nothing is uploaded.
Copy the raw data URI, the HTML <img> tag or the CSS background-image snippet you need.
Check the size and overhead stats; heed the warning before inlining large images.
To go the other way, open Base64 → Image, paste a data URI, then preview and download the file.

Features

Drag-and-drop or file picker for PNG, JPG, GIF, WebP, SVG and more
Ready-to-paste snippets: raw data URI, HTML <img> tag and CSS background-image
Original size, data URI size and Base64 overhead shown at a glance
Bloat warning when a data URI grows past 100 KB
Reverse mode: paste a data URI or Base64 to preview and download the image
100% client-side — your image never leaves your device

Frequently asked questions

What is a Base64 image or data URI?

A data URI encodes an image directly as text, so it can be embedded inside HTML or CSS instead of being loaded from a separate file. It starts with "data:image/png;base64," followed by the Base64-encoded bytes of the image.

How do I convert an image to Base64?

Drag your image onto the drop zone or click to select it. The tool reads the file in your browser and produces the data URI instantly, along with copy-ready HTML and CSS snippets. No upload and no sign-up are needed.

Does encoding to Base64 make the image bigger?

Yes. Base64 adds about 33% to the byte size, so a 30 KB image becomes roughly 40 KB of text. That is why this tool shows the overhead and warns you when a data URI is large enough to slow down your HTML or CSS.

Is it safe to convert images here?

Yes. Everything runs locally in your browser using the FileReader API. Your image is never uploaded to a server, so even confidential graphics stay entirely on your device.

Can I convert a Base64 string back into an image?

Yes. Open the Base64 → Image tab and paste a full data URI or a raw Base64 string. The tool previews the image and gives you a download button to save it as a PNG, JPG, GIF, WebP or BMP file.

Image to Base64 Converter

Data URI

HTML <img> tag

CSS background-image

How to use

Features

Frequently asked questions

Related tools