Base64 Encode/Decode: UTF-8 Pitfalls

Base64 encodes arbitrary bytes as ASCII using A–Z, a–z, 0–9, +, / (URL-safe variants use -, _). It is for transport and embedding — email attachments, data URLs, JWT segments — not for hiding secrets. Anyone can decode it.

UTF-8 pitfalls

Mistake	Result
Treat Base64 as a string cipher	False sense of security
Encode with wrong charset	Decode mojibake
Confuse Base64 and Base64url	JWT/header failures
Strip padding carelessly	Some decoders reject input

In JavaScript, prefer TextEncoder / TextDecoder (UTF-8) around Base64 helpers. Legacy escape/unescape hacks fail on emoji and non-Latin text.

Encode and decode locally

1. Open TryDevSnip Base64.
2. Encode text or decode a payload.
3. If the result looks broken, re-check UTF-8 and whether the source was binary (images, protobuf) rather than text.
4. For URL query safety, use URL Encode instead of (or after) Base64 when appropriate.

Privacy one-liner: encode/decode runs in your browser; not uploaded to our servers for processing.

Related reading: JWT decode — JWT parts are Base64url, not standard Base64.

A quick mental model

Think of Base64 as a shipping carton: same contents, different packaging for ASCII-safe channels. Opening the carton (decode) returns the original bytes. If those bytes were UTF-8 text, decode to a string; if they were an image or protobuf, keep them binary. Mixing those interpretations is how “valid Base64” still produces garbage on screen.

FAQ

Is Base64 encrypted?

No. It is reversible encoding with no key.

Why does my Node decode differ from the browser?

Different padding handling, URL-safe alphabet, or binary vs UTF-8 string APIs (Buffer vs atob).

When should I use Base64url?

JWTs, some OAuth tokens, and anywhere + / or = break in URLs or filenames.

Can I Base64 a file?

Yes — as bytes. Data URLs do this for small assets; large files bloat ~33% and may stress memory in-tab.