Base64 Encoder / Decoder

Processed locally · Never leaves your browser

Encode text or files to Base64, or decode Base64 back to plain text. Supports Unicode, URL-safe mode, and data URIs.

Input
Output

What is Base64?

Standard
A-Z a-z 0-9 + /
URL-safe
A-Z a-z 0-9 - _ (no padding)
Data URI
data:image/png;base64,...
Runs entirely in your browser — nothing is uploaded
Runs entirely in your browser. No uploads. Your files stay private.

What Is Base64 Encoding?

Base64 is a binary-to-text encoding defined in RFC 4648 that maps every 3 bytes of binary data onto 4 printable ASCII characters drawn from a 64-symbol alphabet (A-Z, a-z, 0-9, plus + and /, with = used as a padding marker). It exists because many transport channels (SMTP mail bodies, JSON strings, URL query strings, XML attributes) cannot safely carry arbitrary 8-bit bytes, but they all reliably carry plain ASCII.
This converter runs entirely in your browser using the built-in btoa() and atob() functions exposed on the window object. Those functions only handle Latin-1, so for Unicode strings the tool first percent-encodes the text via encodeURIComponent and then walks each escape sequence back into a byte before encoding. That extra step is what lets emoji and non-ASCII characters round-trip correctly without producing the dreaded InvalidCharacterError.
URL-safe mode swaps + for - and / for _ and strips trailing = padding, matching the variant used by JSON Web Tokens, OAuth state parameters, and S3 pre-signed URLs. The encoded payload can then be dropped directly into a query string or filename without any percent-encoding pass. The decoder accepts both standard and URL-safe input and normalizes back before calling atob.
The size cost is fixed: encoded output is always about 4/3 the size of the input plus 0-2 bytes of padding, so a 1 MB image becomes roughly a 1.37 MB data URI. That overhead is the main reason data URIs are best used for small icons and inline images rather than large media assets, where a real HTTP request usually wins on cache reuse and gzip ratio.
The File tab uses the FileReader API in readAsDataURL mode, which produces a complete data URI string of the form data:<mime>;base64,<payload>. The MIME type is read directly from the File object, so PNGs, PDFs, fonts and arbitrary binary blobs all work without configuration. Output can be pasted straight into an <img> src, a CSS background-image, or a fetch() call.
Common pitfalls when decoding: extra whitespace or newlines in the input (atob accepts them in modern browsers but historically did not), missing padding, or accidentally feeding URL-safe input through the standard decoder. The error banner will tell you which case you hit so you can fix the source rather than the encoding.
Base64 is encoding, not encryption. The output is fully reversible by anyone, including search engines and log scrapers. Use it for transport and embedding only - if you need confidentiality, layer real cryptography (AES-GCM via the Web Crypto API, age, libsodium) on top first and Base64 the ciphertext.

Common Use Cases

01

Inline icons in CSS

Embed small SVG or PNG icons as data URIs to eliminate an HTTP request for above-the-fold UI chrome.

02

JWT and OAuth payloads

Encode and decode the URL-safe Base64 segments inside JSON Web Tokens to inspect headers and claims during auth debugging.

03

Kubernetes secrets

Encode TLS certificates, kubeconfig fragments, and API keys for the data: field of a Secret manifest, where Kubernetes expects standard Base64.

04

Email attachments

Produce MIME-compatible Base64 bodies when crafting raw SMTP messages or testing email pipelines.

Frequently Asked Questions

No. Base64 is a deterministic encoding with a public alphabet - anyone can decode it instantly. It provides zero confidentiality. If you need to protect data, encrypt it first (AES-GCM, libsodium) and Base64 the ciphertext for transport.
The encoding represents 3 bytes of binary as 4 ASCII characters, so the output grows by exactly 33%. Add up to 2 padding characters at the end and you get the familiar ~4/3 ratio. URL-safe mode strips padding, saving up to 2 bytes per payload.
URL-safe Base64 (RFC 4648 section 5) replaces + with - and / with _ so the output can sit inside a URL, query parameter, or filename without percent-encoding. Padding (=) is also typically dropped because = is reserved in URLs. JWTs, OAuth state, and most modern APIs use this variant.
Native btoa only accepts Latin-1 characters (code points 0-255). Anything outside that range, including emoji and most non-English scripts, throws InvalidCharacterError. This tool routes Unicode through encodeURIComponent first, converting it to a UTF-8 byte sequence that btoa can handle.
Yes - use the File tab, which uses the FileReader API to produce a full data URI (data:image/png;base64,...). Paste it into an <img src> attribute or a CSS background-image. Keep in mind the 33% size overhead makes this best for icons and small assets, not large photos.
Equals signs are padding. Base64 works in 4-character blocks, so when the input length isn't a multiple of 3, the encoder pads the final block with = to round it out. The decoder uses padding to know where the input ends. URL-safe mode usually omits it.
No. Both the text and file converters run entirely in JavaScript on your machine using btoa, atob, and FileReader. There is no network request involved in the encode or decode step, so the tool works offline once the page has loaded.
Common causes: stray whitespace pasted from a PDF, missing padding, or feeding URL-safe input (with - and _) into the standard decoder. The tool normalizes URL-safe characters automatically, so most failures point at truncated or corrupted input.
Hex (Base16) is simpler and case-insensitive but doubles the byte size. Base64 is denser at 33% overhead, which matters for inline data URIs and large payloads. Hex tends to win for short hashes and machine logs where readability matters more than size.
The text decoder produces a UTF-8 string, so it will only round-trip text. To recover a binary file, paste the data URI into a browser address bar or use the File tab in reverse with a small helper - this tool is optimized for the encode-to-data-URI direction.

Step-by-step guide

How to encode or decode Base64

Walk through every step with screenshots, format-specific tips, and the platform-by-platform limits you need to know.

Advertisement