🗃️ Base64 File Encoder

🔧 Mode

📂 File Selection

🗃️

Drop file here! Drag and drop a file here

or

Select a file to encode to base64

·

📝 Paste Base64 or Data URI

📤 Result

Length: {{ base64Output.length.toLocaleString() }} chars
Paste this directly into an <img src>, CSS url(), or Markdown.

💾 Decoded File

Name:
MIME:
Size:

📝 Text Preview (UTF-8)

⚠️

ℹ️ About Base64 File Encoder

What this tool does

The Base64 File Encoder turns a local file into a base64-encoded string (or full data: URI), and the other direction turns a pasted base64 string back into a downloadable file. Both operations run entirely in your browser — the file bytes never leave your machine and there is no API endpoint for this tool.

Why use base64 for files?

  • Embed binary in text formats. JSON, XML, YAML, HTML, CSS, and email bodies are all text-only — a file has to be re-encoded as base64 (or similar) to ride inside them.
  • Data URIs for the web. A complete data:image/png;base64,iVBOR... string can be pasted into an <img src>, a CSS background-image: url(...), or a Markdown document so the image travels inside the document instead of being requested as a separate file. See RFC 2397 for the data URI grammar.
  • Email attachments. MIME-encoded email attachments are base64 inside multipart bodies, defined by RFC 2045 and RFC 4648.
  • Small assets in API payloads. SDK upload examples, fixtures, and test vectors regularly carry a small PNG / WAV / PDF inline as base64.

Two modes

  • Encode: select a file (or drag it in). The page reads it with FileReader.readAsDataURL, splits out the base64 payload, and shows both the raw base64 and the complete data URI (with the MIME type inferred from the file's reported type or its extension).
  • Decode: paste a base64 string (raw aGVsbG8=, or a full data URI such as data:text/plain;base64,aGVsbG8=). The page runs atob, wraps the bytes in a Blob, and offers a download link. If the payload is text (or the MIME hints at text), an inline preview is also shown.

Size overhead

Base64 expresses 3 bytes as 4 ASCII characters, so encoded output is roughly 33% larger than the input (plus padding). A 100 KB image becomes a ~133 KB base64 string. That is normally fine for icons and tiny assets but is wasteful for anything beyond a few hundred KB — for large files, serve them as a normal file URL instead of inlining them into HTML or CSS.

Data URI format

A data URI looks like data:<mime>[;param=value]*;base64,<payload>. This page accepts:

  • Raw base64: aGVsbG8=
  • Data URI: data:text/plain;base64,aGVsbG8=
  • Data URI with charset: data:text/plain;charset=utf-8;base64,aGVsbG8=
  • URL-safe variant (- / _ and unpadded) is normalised before decoding.

Privacy note

No file or pasted text is uploaded. The encode path reads your file with the browser's own FileReader; the decode path turns base64 into bytes with the browser's atob and offers a Blob URL for download. The page makes no network requests as part of either flow, and there is no server-side endpoint to call.

References

Ready