Embedding a small image directly inside HTML or CSS — to avoid an extra HTTP request for an icon, or to inline an image in a JSON payload — requires converting it to a Base64 text string first.
This guide covers how to convert an image to Base64 for free, and how to decode a Base64 string back into an image.
Key Takeaway: Base64 encoding adds roughly 33% overhead to file size — it's a tradeoff that's worth it for small icons or avoiding extra requests, but not for large photos where the size penalty outweighs the benefit.
When Base64 Makes Sense
| Use case | Worth it? |
|---|---|
| Small icons, under 5KB | Yes — saves an HTTP request |
| Email template images | Often yes — some clients block external images |
| JSON payloads needing inline images | Yes — no separate file handling needed |
| Large photos | No — the 33% size overhead and lack of caching hurts performance |
Tip: Use the CSS url() copy option directly for background images, and the HTML img tag option when you need a complete, ready-to-paste element.
Step by Step: How to Convert an Image to Base64
TinyPNG Now includes a free image-to-Base64 tool that runs entirely in your browser.
- Open the Image to Base64 tool and upload your file.
- Copy the raw Base64 string, a CSS
url()rule, or a full HTML img tag. - To reverse it, switch to the Base64 → Image tab, paste a string, and download it as a file.
Frequently Asked Questions
What is a Base64 image string used for?
Base64 encodes binary image data as text, so it can be embedded directly inside HTML, CSS, or JSON without a separate file request — common for icons, small images, and email templates.
Does converting to Base64 increase file size?
Yes, Base64 encoding adds roughly 33% overhead compared to the original binary file size.
Can I decode a Base64 string back to an image?
Yes. Switch to the Base64 to Image tab, paste the string, and click Decode to Image, then download it.
What output formats does the copy button support?
You can copy the raw Base64 string, a ready-to-use CSS background-image url() rule, or a complete HTML img tag.
Is my image uploaded to a server?
No. Encoding and decoding both happen entirely in your browser using the FileReader API. Your image never leaves your device.
Summary: Open the free TinyPNG Now Base64 converter, upload, copy in the format you need — free, private, and instant.