What Is Base64 Encoding? How It Works
Base64 converts binary data into plain ASCII text so it can travel through channels that only accept text — email, JSON, URLs, HTML. Every 3 bytes become 4 safe characters, the output runs about 33% larger, and anyone can decode it back: it is an encoding, not encryption.
What is Base64 encoding?
Base64 is a method for representing binary data as ASCII text. It takes any sequence of bytes — a photo, a PDF, a password, a random token — and rewrites it using only 64 safe characters: A–Z, a–z, 0–9, + and /, with = as padding. The result is ordinary text you can paste into an email, a JSON field, an HTML page or a URL.
The mechanism is simple regrouping. Three bytes are 24 bits; Base64 splits those 24 bits into four groups of 6 bits, and each 6-bit value (0–63) picks one character from the 64-character alphabet. That is where the name comes from — and why the output is always roughly 4/3 the size of the input.
If you have a string to encode or decode right now, the free Base64 encoder handles it entirely in your browser — nothing is uploaded.
How does Base64 work? The 64-character alphabet
Each of the 64 characters stands for a 6-bit number, 0 through 63. The alphabet is fixed:
| Value range | Characters |
|---|---|
| 0–25 | A B C D E F G H I J K L M N O P Q R S T U V W X Y Z |
| 26–51 | a b c d e f g h i j k l m n o p q r s t u v w x y z |
| 52–61 | 0 1 2 3 4 5 6 7 8 9 |
| 62–63 | + / |
| padding | = (fills the last group; not part of the alphabet) |
These particular characters were chosen because they survive almost everywhere: they are printable, they appear in every text encoding, and email servers, JSON parsers and HTML all leave them alone. Decoding is the exact reverse — look up each character's 6-bit value, glue the bits back together, and split into bytes.
A step-by-step worked example: "Man" becomes "TWFu"
The classic textbook example encodes the three letters Man. Watch the bits move:
- Bytes.
M= 77 =01001101,a= 97 =01100001,n= 110 =01101110. - Concatenate. The three bytes give one 24-bit stream:
010011010110000101101110. - Regroup into 6-bit chunks.
010011010110000101101110. - Convert each chunk to decimal and look it up.
| 6-bit chunk | Decimal value | Alphabet character |
|---|---|---|
010011 | 19 | T |
010110 | 22 | W |
000101 | 5 | F |
101110 | 46 | u |
Result: Man → TWFu. Three bytes in, four characters out — the 4/3 ratio in action. Try it yourself: type Man into the Base64 tool and confirm you get the same four characters.
What is Base64 padding, and when does it appear?
Base64 always emits characters in groups of four, so when the input length is not a multiple of three bytes, the last group comes up short and gets filled with =:
| Input bytes | Output characters | Padding | Example |
|---|---|---|---|
| Multiple of 3 (e.g. 3) | 4 | none | Man → TWFu |
| 3n + 1 (e.g. 1) | 2 real + == | two = | M → TQ== |
| 3n + 2 (e.g. 2) | 3 real + = | one = | Ma → TWE= |
The padding is not decoration: it tells the decoder how many of the final group's bits are real data. One leftover byte makes 8 real bits, which fills one 6-bit chunk plus 2 bits of a second — the remaining two chunks are padding (==). That is why a Base64 string's length (ignoring line breaks) is always a multiple of four.
Why do we need Base64? Five places it shows up
| Where you see it | Why Base64 is there |
|---|---|
| Email attachments (MIME) | Email was designed for text; Base64 wraps images and documents as text parts the mail servers pass through untouched. |
| Data URIs in HTML/CSS | <img src="data:image/png;base64,..."> embeds an image directly in the page — no separate file request. |
| JWT tokens | The header, payload and signature are each base64url-encoded and joined with dots into one compact string. |
| HTTP Basic Auth | Authorization: Basic dXNlcjpzZWNyZXQ= carries user:secret as Base64 text in the header. |
| Binary data in JSON or XML | These formats are text-only, so APIs encode files, keys or hashes as Base64 strings inside the payload. |
Worked example: how big does the output get?
Take Hello! — 6 bytes. Six is a multiple of three, so the ratio is exactly 4/3: 6 bytes → 8 characters, SGVsbG8h. Now take Hello, World! — 13 bytes. That is four full groups (12 bytes → 16 characters) plus one leftover byte (1 byte → 2 characters + ==): SGVsbG8sIFdvcmxkIQ==, 20 characters total. The ratio looks worse than 4/3 for short strings (20 ÷ 13 ≈ 1.54) because padding contributes a fixed overhead that fades as the input grows — at megabytes, the output converges on exactly 33.3% larger.
Base64 vs base64url: know which one you have
The + and / characters have special meanings in URLs and filenames, so a variant called base64url swaps them out:
| Standard Base64 | base64url | |
|---|---|---|
| Characters 62–63 | + / | - _ |
| Padding | kept (=) | usually dropped |
| Typical use | email, data URIs, Basic Auth | JWTs, URL parameters, filenames |
The two are not interchangeable. Decoding a base64url string with a standard decoder — or pasting standard Base64 with + and / into a URL — silently corrupts the data. If a token contains - or _, it is base64url; make sure the tool you use matches.
Practical tips
- Base64 is not secrecy. It is trivially reversible with no key. Treat an encoded secret exactly like the plaintext — encrypt first if it must stay private.
- Strip whitespace before decoding. MIME wraps Base64 at 76 characters per line; most decoders ignore newlines, but some choke on them. Removing all whitespace is the safe first step.
- Missing padding is usually fine to re-add. base64url strings often drop the
=. If a decoder complains about length, pad the string with=until its length is a multiple of four. - Don't Base64 huge files for the web. A 2 MB photo becomes ~2.7 MB of text and can't be browser-cached separately. Reserve data URIs for tiny icons; serve real images as files.
- Match the alphabet to the source. Seeing
-or_means base64url;+or/means standard. Convert or choose the right decoder before assuming the data is corrupt. - Validate before you trust decoded output. A successful decode doesn't prove the bytes are meaningful — check for expected headers (like PNG's
‰PNG) before feeding decoded bytes to another program.
Try it yourself
Encode or decode any text right in your browser — paste a string, see the Base64 instantly, no upload involved.
Frequently asked questions
What is Base64 encoding used for?
Base64 is used whenever binary data must travel through a channel that only accepts text. Classic cases: email attachments (MIME), images embedded directly in HTML or CSS as data URIs, the three segments of a JWT token, HTTP Basic Auth credentials, and binary values stored in JSON or XML. Any of those would break or get corrupted if the raw bytes were pasted in as-is.
Is Base64 encryption?
No. Base64 is an encoding, not encryption — it changes how data looks, not who can read it. Anyone can decode a Base64 string in seconds with a free tool, and there is no key involved. Never use it to hide passwords, API tokens or personal data. If information needs secrecy, encrypt it first, then Base64-encode the encrypted bytes if they must travel as text.
Why does Base64 make data bigger?
Because three bytes become four characters: 3 × 8 = 24 bits are regrouped as 4 × 6 bits, and each 6-bit group is one character. So the output is always about one-third larger than the input — 1,000 bytes become roughly 1,334 characters. Padding adds a character or two for inputs whose length is not a multiple of three, but the 4/3 ratio is the dominant effect.
What are the = signs at the end of a Base64 string?
They are padding. Base64 output must come in groups of four characters, so when the input is not a multiple of three bytes, the encoder fills the missing spots with =. One leftover byte produces two = characters (for example M becomes TQ==), two leftover bytes produce one = (Ma becomes TWE=), and a full group of three needs none (Man becomes TWFu). The padding tells the decoder how many bytes the last group really holds.
What is the difference between Base64 and base64url?
They encode the same way but use different last two alphabet characters. Standard Base64 uses + and /, which have special meanings in URLs and filenames, so base64url replaces them with - and _ and usually drops the = padding. JWT tokens, for instance, use base64url so each segment can sit safely inside a URL. The two are not interchangeable: feeding base64url data to a standard decoder (or vice versa) produces garbage.
Can Base64 encode images and files?
Yes — Base64 works on any bytes, not just text. An image becomes a long text string that can be pasted into HTML as a data URI (data:image/png;base64,...) so the page loads it without a separate file. This is handy for tiny icons, but a poor deal for large photos: the file gets ~33% bigger, and unlike a separate image file it cannot be cached by the browser across pages.