How Base64 encoding works

Base64 is a way to represent any binary data, such as an image, a file or a cryptographic key, using only 64 printable characters. It exists because many systems were designed to carry text, not raw bytes: email, URLs, HTML, JSON and HTTP headers. Base64 lets binary data travel through them safely. This guide explains how the encoding works, where you'll see it, and the mistakes that trip people up.

The alphabet

Standard Base64 (RFC 4648) uses:

• A–Z for values 0–25
• a–z for values 26–51
• 0–9 for values 52–61
• + for 62 and / for 63
• = for padding at the end

How encoding works, step by step

Base64 takes the input 3 bytes (24 bits) at a time and splits them into four 6-bit groups. Each 6-bit group (a value from 0 to 63) maps to one character.

Encoding the text Man:

	M	a	n
Bytes	77	97	110
Bits	01001101	01100001	01101110

Regrouped into 6-bit chunks: 010011 010110 000101 101110 → 19, 22, 5, 46 → T, W, F, u. So Man becomes TWFu.

Padding

When the input length isn't a multiple of 3, the last group is incomplete. Base64 pads it with zero bits and marks the gap with =:

• Ma (2 bytes) → TWE=
• M (1 byte) → TQ==

That's why encoded output is always a multiple of 4 characters, and why it grows by about 33%: every 3 bytes become 4 characters.

Base64 and Unicode text

Base64 works on bytes, not characters. Text has to be turned into bytes first, almost always as UTF-8. This is where JavaScript's built-in btoa() causes trouble: it only accepts characters in the Latin-1 range and throws an error on text like café 😀. Encode to UTF-8 bytes first:

javascript
const bytes = new TextEncoder().encode('café 😀');
const base64 = btoa(String.fromCharCode(...bytes));

The Base64 tool on this site does this for you, so emoji and non-Latin scripts round-trip correctly.

URL-safe Base64

+, / and = have special meanings in URLs. The base64url variant replaces + with - and / with _, and usually drops the padding. JWTs, many OAuth parameters and some IDs use it. To decode base64url with a standard decoder, swap the characters back and re-add = until the length is a multiple of 4.

Where you'll see Base64

• JSON Web Tokens: each of the three dot-separated parts is base64url. The middle part decodes to readable JSON with the user's claims; see JWTs explained.
• HTTP Basic authentication: Authorization: Basic dXNlcjpwYXNz is just user:pass in Base64.
• Data URLs: data:image/png;base64,iVBORw0... embeds a small image directly in HTML or CSS.
• Binary data in JSON: JSON has no binary type, so APIs send file contents and signatures as Base64 strings.
• Email attachments: MIME encodes attachments in Base64.

Base64 is not encryption

Anyone can decode Base64 instantly; it hides nothing. Treat a Base64-encoded token or password exactly as you'd treat the plain text. If you see credentials "protected" with Base64 in a config file or a request, they're effectively in the clear.

When not to use it

• Large files in JSON. The 33% overhead plus JSON parsing makes multi-megabyte Base64 strings slow. Upload the file separately and send a URL instead.
• Images in CSS for anything but tiny icons. Inlined images can't be cached separately and bloat your stylesheet.

Try it

Paste text into the Base64 Encoder/Decoder to encode it, or paste Base64 to decode it. Everything runs locally in your browser.