Base64 Encoding Explained: What It Is and When to Use It

Base64 is a way to represent binary data using 64 printable ASCII characters: A-Z, a-z, 0-9, + and /, with = for padding. It exists so arbitrary bytes can travel through systems designed for text, such as email, JSON and URLs. It is not encryption, and anyone can decode it instantly.

How Base64 works

Base64 takes input bytes three at a time (24 bits) and splits them into four 6-bit groups. Each 6-bit value, 0 to 63, maps to one character in the alphabet. The string Man is bytes 77 97 110, which becomes TWFu. If the input length is not a multiple of three, the final group is padded with = signs: Ma becomes TWE= and M becomes TQ==.

The cost is size. Every 3 bytes become 4 characters, so Base64 output is about 33% larger than the input, plus padding. A 300 KB image becomes roughly 400 KB of text.

Why it exists

Many protocols were built for 7-bit ASCII text and choke on raw bytes. Email (MIME) is the classic case: attachments are Base64 so they survive mail servers that mangle anything outside printable characters. The same problem shows up anywhere a text container needs to carry bytes:

• JSON has no binary type, so APIs put file contents in a string field as Base64.
• HTTP headers are text, so HTTP Basic Auth sends Authorization: Basic dXNlcjpwYXNz, which is just user:pass encoded.
• Data URIs embed files directly in HTML or CSS: data:image/png;base64,iVBORw0KGgo....
• JWTs carry their header and payload as base64url segments separated by dots.
• Certificates and keys in PEM format are Base64 between -----BEGIN and -----END lines.

Base64 is not security

Because the alphabet and algorithm are public, decoding needs no key. dXNlcjpwYXNz turns back into user:pass in one call. Basic Auth credentials, JWT payloads and anything else that is "just Base64" are readable by anyone who sees the string. If you need secrecy, encrypt first and then Base64 the ciphertext if it must travel as text. If you need to confirm data has not been tampered with, use a signature or HMAC.

Treat a Base64 string exactly as you would treat the plain text it contains. Logging it, pasting it in a ticket or committing it to git exposes the original data.

Standard Base64 versus base64url

Standard Base64 uses + and /, both of which have special meaning in URLs. + becomes a space in query strings and / is a path separator. The base64url variant (RFC 4648, section 5) swaps them for - and _ and usually drops the = padding. That is why a JWT looks like eyJhbGciOiJIUzI1NiJ9 with no padding and no slashes.

If a decoder rejects a token with "invalid character", check which variant you have. Converting is a two-character replace: - to +, _ to /, then re-add = until the length is a multiple of four. The Base64 encoder and decoder handles plain strings including Unicode, so you can check what a given segment contains.

Encoding in common languages

• JavaScript (browser): btoa("hello") gives aGVsbG8= and atob() reverses it. These work on Latin-1 strings only; for Unicode, encode to UTF-8 bytes first with TextEncoder, then convert the bytes.
• Node.js: Buffer.from("hello").toString("base64") and Buffer.from(s, "base64").toString(). Pass "base64url" for the URL-safe variant.
• Python: base64.b64encode(b"hello") returns b'aGVsbG8='; use base64.urlsafe_b64encode for the URL-safe form. Input must be bytes, so call .encode("utf-8") on strings.
• Shell: echo -n "hello" | base64 to encode and base64 -d to decode. The -n matters, or you encode a trailing newline too.

The Unicode point trips people up most. btoa("é") throws in the browser because é is outside Latin-1. Encode to UTF-8 bytes first and the result is w6k=.

Embedding images as data URIs

Small icons and logos can be inlined into HTML or CSS as data:image/svg+xml;base64,... to save an HTTP request. This is worth it for images under a few kilobytes that appear on every page. For anything larger, the 33% size penalty and the loss of browser caching make a normal image URL the better choice. The Image to Base64 converter outputs the raw string, a full data URI, a CSS background rule or an HTML img tag so you can paste whichever form you need.

Base64 versus URL encoding

They solve different problems. Base64 turns arbitrary bytes into safe text. URL encoding (percent-encoding) escapes specific reserved characters in text that is already text: a space becomes %20 and & becomes %26. You often need both: Base64 a value, then URL-encode it if it goes into a query string, because standard Base64 contains +, / and =. The URL encoder shows exactly which characters change.

More encoding and formatting tools are in the developer category.

Try it

Paste any string, token segment or Basic Auth header value into the Base64 encoder and decoder. It runs entirely in your browser, handles Unicode, and switches between encode and decode with one toggle.