Image to Base64
Convert an image to a Base64 string and Data URI, with ready-to-paste CSS and HTML code. You can also paste a Base64 string to turn it back into an image.
File info
A preview appears when you add an image.
Result
Paste a string and click Convert to image.
How to use
When it helps
Base64 is a way of writing binary files such as images as plain text. Embedding a small icon or loading graphic directly in CSS or HTML saves an extra file request, and lets you show images in places that cannot hold separate files, like email signatures or single-file HTML pages.
Add an image and this tool produces a Data URI, raw Base64, CSS background code and an HTML img tag at once. Going the other way, paste a Base64 string from an API response or source code to see what image it is and save it as a file.
Base64 is about a third larger than the original and cannot be cached separately by the browser. Use it only for small images of a few KB, and keep larger photos as regular files.
FAQ
Why does Base64 make files bigger?
It represents every 3 bytes with 4 characters, so the result is about 33% larger. That is why it is best for small icons.
What is the difference between a Data URI and Base64?
A Data URI has a prefix like "data:image/png;base64," and can be used directly like a URL. Raw Base64 has no prefix and is used in APIs or JSON.
Can Base64 without a prefix be turned back into an image?
Yes. The file type (PNG, JPG, GIF, WEBP, SVG and more) is detected from the first bytes.
Is my image uploaded to a server?
No. All conversion happens inside your browser.
Does it work with SVG?
Yes. SVG files can be converted to Base64 Data URIs too.