Base64 Image Encoder
Convert images to Base64 string and back. Upload any image and get its data URL instantly.
About this calculator
Upload an image and get its Base64 data URL, or paste a data URL and preview the image. Copy the result into HTML, CSS or JSON.
The conversion runs locally, so private images stay on your device.
How to use it
- Choose an image.
- Copy the Base64 Data URL.
- To reverse it, paste a data URL and press Preview Image.
How it works
A data URI embeds a file in text: data:image/png;base64,iVBOR…. The browser decodes the string back into the image, so no separate request is needed. Base64 makes the data about 33% larger, so embedding pays off only for small images (a few KB), such as icons and tiny logos.
Worked example
Typical use
| HTML | <img src="data:image/png;base64,…"> |
| CSS | background:url(data:image/png;base64,…) |
Tips and common mistakes
- Inline only small images. Large ones slow the page and cannot be cached separately.
- SVG icons can often be used as plain text in a data URI without Base64.
- Compress images before encoding.
- Data URIs work in HTML img tags, CSS backgrounds and emails (with varying support).
- For repeated use, a normal image file is cached by the browser and is usually better.
Frequently asked questions
What is a Base64 image?
An image encoded as text and embedded directly in HTML or CSS.
When should I use a data URI?
For tiny icons that you want without an extra request.
Does it work in email?
Support varies; many email clients block data URIs.
Why is the string so long?
Base64 adds 33% and images are large.
Can I decode back to an image?
Yes, paste the string into the decode box and preview.
Is my image uploaded?
No, it stays in your browser.