Image to Base64
Convert an image to a Base64 data URI and back, without uploading the file.
Pick an image to see its Base64 data URI here.
About the Image to Base64
Converting an image to Base64 turns a picture into a long text string that you can paste directly into HTML, CSS, JSON, or a configuration file. This tool reads the file you pick and produces a complete data URI, the kind that starts with something like data:image/png;base64,, so the result is ready to drop into a src attribute or a CSS background-image rule.
Inlining an image as Base64 is handy when you want to ship a small icon, logo, or placeholder without making a separate network request. Email templates, single file demos, and embedded SVG sprites all benefit from having the picture travel inside the markup. The trade off is size: Base64 adds roughly a third to the byte count, so it suits small graphics far better than large photographs.
The tool also works the other way. Paste a data URI or a raw Base64 string into the decode panel and you get a live preview of the decoded image, which is useful for checking that a string you found in a stylesheet or an API response actually holds a valid picture. If the text is not a real image, the preview simply tells you instead of showing a broken graphic.
Everything happens in your browser. The file you choose is read locally with the FileReader API and the encoding or decoding runs on your own machine. Nothing is uploaded to a server, so private screenshots, design assets, and internal diagrams never leave your computer.
Reach developers and designers who use these tools every day. Privacy-first, no trackers.
Frequently asked questions
How do I convert an image to a Base64 string?
Choose the Image to Base64 mode, pick a file with the file picker, and the data URI appears in the output panel. Use the copy button to grab the full string.
What is a data URI and how is it different from raw Base64?
A data URI is the full value, including the data: prefix and the MIME type, such as data:image/png;base64,iVBOR... Raw Base64 is only the encoded part after the comma. For use in an img src or CSS you usually want the complete data URI.
Can I decode a Base64 string back into an image?
Yes. Switch to the Base64 to Image mode and paste either a full data URI or a raw Base64 string. The tool shows a live preview, and if the string starts without a data prefix it assumes PNG so it can still attempt to render it.
Are my images uploaded anywhere when I use this tool?
No. The conversion runs entirely in your browser using the FileReader API and the DOM. The file is never sent to a server, so your images stay private on your own device.
Should I always inline images as Base64?
Only for small assets. Base64 increases the size by about a third and the inlined data cannot be cached separately from the page, so large photos are better served as normal image files.