Base64 ⇄ Image Converter
Convert an image file up to 200MB to a Base64 string, or decode Base64 / a data URL back into a viewable, downloadable image.
Drag & drop a file here, or click to browse
PNG, JPG, WebP, GIF, SVG… up to 200MB
How to use this tool
Image → Base64: drop in a PNG, JPG, WebP, GIF or SVG and copy the complete data: URL, ready for an src attribute or a CSS url(). Base64 → Image: paste a data URL or bare Base64 to see the picture and download it.
Worked example: two icons from this site
- The 32 × 32 favicon, a 674-byte PNG, becomes a 922-character data URL: 900 characters of Base64 plus the 22-character
data:image/png;base64,prefix. - The 512 × 512 app icon, 15,529 bytes, becomes 20,730 characters.
Inlining the small one saves a separate request for a file of well under 1 KB, which is what data URLs are good for. The large one adds 20 KB of text to every page or stylesheet that contains it, downloaded again with each copy, whereas a linked file is fetched once and then cached. The same logic applies to SVG icons, although for those the SVG markup itself can often be pasted into HTML directly, without Base64 at all.
Base64 images in email
Some mail programs block linked images until the reader allows them, which is why inlining a logo is tempting. According to caniemail.com's tests, Gmail, Apple Mail and Outlook display Base64 images, except that Outlook 2007–2019 for Windows skips Base64 GIFs, and a few webmail services, including Orange, LaPoste.net and SFR, don't show them at all. Those results were last verified in February 2020, so send yourself a test first.
Frequently Asked Questions
Why won’t my Base64 string decode?
Spaces and line breaks are removed before decoding, so wrapped text is fine. Two things still fail: URL-safe Base64, which uses - and _ instead of + and / (swap them back first), and a string that was cut short when it was copied. A bare string with no data: prefix is treated as a PNG; paste it as a data URL such as data:image/jpeg;base64,... if you want the download saved with the right type.
Does gzip on my server cancel out the extra 33%?
Not really. Base64 text inside HTML or CSS does get compressed along with the page, but so little that it stays bigger than the image: gzipped, this site's 674-byte favicon PNG came to 697 bytes and its Base64 text to 721. The saving from inlining is the request, not the bytes.
Does converting to Base64 and back change the image quality?
No — Base64 encoding is lossless. It's just a different text representation of the exact same bytes, so decoding it back reconstructs the original image pixel-for-pixel and byte-for-byte identical to what you started with, regardless of format (PNG, JPG, WebP, SVG).
Related Tools
Related Blog Posts
How to Convert JSON to Excel, CSV, XML and YAML (and Back)
What actually happens to your data when JSON becomes a spreadsheet, XML, or YAML: missing keys, nested values, leading zeros, and the XML array problem, with real converter output.
Read moreConverting CSV and XML to Excel Without Losing Data
Why double-clicking a CSV mangles PIN codes, long IDs and ₹ signs, what a careful CSV-to-Excel conversion does instead, and how XML records map to spreadsheet columns.
Read moreHow to Flatten Nested JSON and Convert JSONL Files
How dot-notation flattening turns nested objects and arrays into spreadsheet columns, what survives the trip back, and how JSON Lines differs from a normal JSON file.
Read more