Convert an image to a Base64 data URI, raw Base64, a CSS background or an HTML img tag, or decode Base64 back into a downloadable image. Runs in your browser.
Embedding a small image straight into HTML, CSS, JSON or an email template means turning its bytes into text. This tool reads an image file in your browser and gives you the result as a data URI, as raw Base64, as a ready-to-paste CSS background-image rule or as an HTML img tag, with a preview and the size before and after. It also works in reverse: paste a Base64 string or a data URI and get the image back, with a preview and a download button. Nothing is uploaded; the file never leaves your device.
Raw Base64 is just the encoded bytes. A data URI wraps those bytes with a prefix that names the file type, for example data:image/png;base64, followed by the encoded text. You need the full data URI to use the image directly in an img src or a CSS url(); you need the raw form when an API or a JSON field expects only the encoded bytes.
Base64 writes every 3 bytes of data as 4 characters, so the text is about one third larger than the file (the tool shows both sizes). Base64 images also cannot be cached separately from the page that contains them, so it is best kept for small images such as icons and tiny logos, not photos.
Yes. In Base64 to Image mode the tool accepts a full data URI or just the encoded text, with or without padding characters, with line breaks or spaces inside, and in the URL-safe form that uses - and _ instead of + and /. It works out the real image type from the first bytes of the data rather than trusting the prefix, and tells you if the two disagree.
It names the problem: an invalid Base64 character, a string whose length cannot be valid Base64 (usually truncated text), a data URI that is not Base64 encoded, or data that decodes fine but is not a PNG, JPG, GIF, WebP, BMP, SVG, ICO or AVIF image. For example, a Base64 PDF is rejected here; use Base64 to PDF for that.
Yes, SVG is encoded like any other image and the preview renders it. For SVG you can also put the markup in a data URI as percent-encoded text instead of Base64, which is often smaller; this tool produces the Base64 form, which works everywhere a data URI is accepted.
No. The file is read with the browser FileReader and the decoding uses your own browser, so the image and its Base64 text stay on your device.
Support for data URI images in email is inconsistent, and many email clients block or strip them, so linked or attached images are the safer choice for email. Data URIs work reliably in web pages, CSS files and most app code.
← All tools · File Utilities · Blog · Cheat sheets · FAQ