Image to Base64
Encode any image into a Base64 data URI and copy it as a data URI, CSS background, or HTML tag — all in your browser.
Your image never leaves your browser. Encoding runs on your device with the FileReader API — nothing is uploaded.
How it works
Upload your image
Choose data URI, CSS or HTML output
Copy the encoded string
About this tool
Base64 encoding lets you embed an image directly inside your HTML, CSS or JavaScript as a text string, removing the need for a separate file and an extra network request. This free image-to-Base64 encoder takes any PNG, JPG, WebP, GIF or SVG and produces a clean data URI, then lets you copy it as a raw data URI, a CSS background-image rule, or a complete HTML <img> tag. It's ideal for small icons, email signatures, inline SVGs and quick prototypes where bundling the asset is simpler than hosting it. Keep in mind that Base64 data is roughly a third larger than the original file and can't be cached on its own, so it suits small images best. Everything is encoded locally in your browser, so your image is never uploaded and stays completely private.
Frequently asked questions
It's an image encoded as text using the Base64 scheme, wrapped in a data URI like data:image/png;base64,…. Because it's plain text, you can embed it directly in HTML or CSS without a separate image file.
For small assets — icons, logos, tiny background patterns — where inlining avoids an extra HTTP request. Avoid it for large images, since Base64 is about 33% bigger than the original file and can't be cached separately.
Three: a raw data URI, a CSS background-image rule, and a ready-to-paste HTML <img> tag. Switch between them and copy with one click.
PNG, JPG, WebP, GIF and SVG. SVGs stay compact when encoded, which makes them a good fit for inline icons.
No. Encoding happens entirely in your browser with the FileReader API, so your image never leaves your device.
Related tools
Explore more free tools
Every category runs free in your browser — nothing is uploaded.