Image to Base64
Convert an image file into a Base64 data URI, or paste one back in to preview and download the image it represents.
Image β Base64
Base64 β Image
What a data URI is
A Base64 data URI encodes an entire image as text, prefixed with its MIME type β for example data:image/png;base64,... β so it can be embedded directly inside CSS, HTML, or JSON without a separate file request. The trade-off is size: Base64 text is roughly a third larger than the original binary file.
Common uses
- Embedding a small icon or logo directly inside a CSS file or HTML email
- Extracting and saving an image from a data URI found in a browser's dev tools or an API response
- Passing an image through a system (like some form submissions) that only accepts text fields
Frequently asked questions
When should I use a Base64 image instead of a regular image file?
Base64-embedding suits very small images (icons, tiny logos) where avoiding an extra HTTP request outweighs the ~33% larger file size β for anything bigger than a few KB, a regular linked image file is usually more efficient.
Why is my Base64 string so long?
Base64 encodes every 3 bytes of the image as 4 text characters, so even a modest-sized image produces a very long string β this is normal and expected, not a sign of an error.
How do I turn a Base64 string back into a downloadable image file?
Paste the full data URI (starting with data:image/...;base64,...) into the second box on this page, or paste just the raw Base64 and select the correct image type, then click "Preview & enable download."
Can I use a Base64 image directly in HTML?
Yes β set it as the src attribute of an tag, like
, and the browser will render it without a separate image file request.