Base64 is a way of representing binary data using only the 64 printable ASCII characters A–Z, a–z, 0–9, + and /. It lets you embed a file inside text-only contexts such as JSON payloads, HTML, CSS, or email. This free tool encodes a file to base64 and decodes base64 back to a file, all in your browser.
How it works
To encode, the tool reads your file with FileReader.readAsDataURL, which yields a string of the form data:<mime>;base64,<payload>. It splits off the payload so you can copy either the bare base64 or the full data URI. Encoding groups the file’s bytes three at a time and maps each group to four base64 characters, which is why the output is roughly 33% larger than the input.
To decode, the tool takes your pasted base64 (stripping a data: prefix if present), runs atob to recover the original bytes, packs them into a Uint8Array, and offers the result as a downloadable Blob.
Tips and notes
Base64 is an encoding, not encryption — anyone can decode it, so never treat it as a way to hide secrets. It is best for small assets; embedding a multi-megabyte file inline bloats your HTML or JSON and slows parsing. When decoding, remember to set the correct file extension yourself, because raw base64 does not record the original file name or type.
Common reasons to encode a file to base64
Embedding images in CSS or HTML: A small icon or background image can be inlined as a data URI — url("data:image/svg+xml;base64,...") — so the browser fetches one fewer resource and the element renders without a separate HTTP request. This is most beneficial for files under about 5 KB; above that size, the bandwidth overhead of base64 (roughly 33% larger than the original) usually outweighs the saved request round-trip.
Sending binary data in a JSON or XML API: Many APIs that accept only text payloads expect binary attachments as base64 strings in a JSON field. Email APIs (for example SendGrid and Mailgun) accept attachments this way.
Storing binary in text-only databases or configuration: If you need to store a small certificate, key, or image in a plain-text config file or a string-only database column, base64 is the standard approach.
Size considerations
| Original file size | Base64 output size | Data URI overhead |
|---|---|---|
| 1 KB | ~1.37 KB | Small; usually fine to inline |
| 10 KB | ~13.7 KB | Borderline; benchmark before inlining |
| 100 KB | ~137 KB | Usually too large to inline; serve as a separate file |
| 1 MB | ~1.37 MB | Almost always wrong to embed as base64 |
For larger files, always serve the file via a URL rather than embedding it as base64. Browsers can cache a referenced file, but an inline data URI must be re-downloaded every time the containing page or stylesheet is fetched.
Decoding tip: set the file extension correctly
When you decode base64 back to a file, the tool offers a name field. Set the correct extension — .png, .pdf, .docx, etc. — because the browser and your operating system rely on the extension (and MIME type) to open the file with the right application. Raw base64 carries no record of the original file type.