Image to Base64 Converter
Convert an image to a Base64 string or data URI, ready to paste into HTML, CSS or JSON.
or browse filesdrop an image here or paste
This browser cannot show this image, but its Base64 is ready.
Convert an image to a Base64 string or data URI, ready to paste into HTML, CSS or JSON.
or browse filesdrop an image here or paste
This browser cannot show this image, but its Base64 is ready.
Drop a PNG, JPG, GIF, WebP, SVG or ICO file on this page and it turns into Base64 text at once. Four ready results appear next to the picture: the Data URI, the bare Base64 string, an HTML img tag and a CSS background line. Click any of them and the whole value is copied, ready to paste into your code, a JSON payload, an email template or a config file. Each row shows the start and the end of the string so you can see what you are copying; the full text goes to the clipboard in one piece, however long it is.
This Base64 image encoder works on the file exactly as it is on your disk. It does not redraw the picture or save it again, so the string decodes back to the very same bytes, with the same quality and the same format.
The Base64 row is the pure encoded data, the form APIs, databases and JSON fields usually ask for. The Data URI row adds the header a browser needs to show it, for example data:image/png;base64, followed by the same string. Paste the Data URI anywhere a web address for an image is expected: an img src, a CSS url(), a Markdown image or the address bar. The type in that header is read from the file's own signature rather than its name, so a PNG saved with a .jpg extension still gets image/png and displays correctly.
The HTML img row is a complete tag with the Data URI already in src, plus the width and height of the image so the page does not jump while it loads. The CSS row is a background-image declaration you can drop into any rule. Inline images like these save a request for small icons, logos and email graphics, where a separate file might be blocked or lost. Base64 text is about a third larger than the file itself, so for big photos a normal image file is usually the better choice; shrink it first with Compress Image if it has to be inline.
Got a string and need the picture? Paste it into Base64 to Image, which decodes it, shows the image and downloads it with the right extension. A string made here comes back byte for byte identical.
The encoding happens inside your browser: the image is read from your device and never uploaded, and the Base64 goes straight to your clipboard. Because the original bytes are encoded, anything stored in the file travels with the string, including camera details and GPS location in a phone photo. Check what a photo carries with the EXIF Viewer before you publish its Base64.
Select or drop the image on this page, or paste it from the clipboard. The Base64 string and the Data URI appear right away; click the one you need and it is copied.
Base64 is only the encoded data. A Data URI is the same data with a short header in front, data:image/png;base64, that tells the browser what kind of file it is, so it can be used directly as an image address in HTML or CSS.
No. The tool encodes the original file without touching its pixels, so decoding the string gives back exactly the same file. Base64 is a text form of the bytes, not a new compression.
Base64 writes every three bytes of the file as four text characters, so the string is about a third larger than the image. A photo from a phone camera becomes millions of characters, which is why each row shows only the start and the end.
No. The file is read and encoded on your device and the result goes straight to your clipboard. Nothing is sent anywhere, which matters when the picture is a private photo or an unreleased design.