Base64 Encoding Explained: How Binary Converts to Text & Why Size Increases 33%
The mathematical mechanics of 6-bit radix-64 representation, padding rules with "=", URL-safe variants, and data URIs.
- Why does Base64 encoding increase file size by 33%?
- How does the 6-bit chunking algorithm work?
- What does the equal sign (=) at the end of a Base64 string mean?
- What is the difference between standard Base64 and URL-safe Base64?
1. Why Base64 Encoding Exists
Early computer network protocols like SMTP email and Usenet were engineered strictly for 7-bit ASCII text. When binary data (such as photos, ZIP files, or encrypted keys) was transmitted, transmission gateways frequently corrupted raw 8-bit bytes.
Base64 was developed to safely represent any arbitrary binary stream using an index of 64 universally printable ASCII characters (A-Z, a-z, 0-9, +, and /).
2. The 6-Bit Chunking Algorithm
Computer memory stores data in 8-bit bytes. Base64 groups three consecutive 8-bit bytes together to form a 24-bit sequence (3 * 8 = 24 bits).
That 24-bit sequence is then partitioned into four 6-bit numbers (4 * 6 = 24 bits). Each 6-bit value (ranging from 0 to 63) maps directly to an ASCII character in the Base64 alphabet.
| Step | Byte 1 ("M") | Byte 2 ("a") | Byte 3 ("n") | |
|---|---|---|---|---|
| ASCII Character | M | a | n | |
| Decimal Code | 77 | 97 | 110 | |
| 8-Bit Binary | 01001101 | 01100001 | 01101110 | |
| Combined 24-Bit Stream | 01001101 | 01100001 | 01101110 | |
| Divided into 4 x 6-bit chunks | 010011 (19) | 010110 (22) | 000101 (5) | 101110 (46) |
| Base64 Output Characters | T | W | F | u |
3. Why File Size Increases by Exactly 33.3%
Because every 3 raw input bytes are translated into 4 encoded output characters, the output stream is mathematically 4/3 the size of the original data.
This represents an unavoidable 33.33% file size expansion. A 300 KB image file converted into a Base64 string will always weigh approximately 400 KB.
4. Understanding Equal Sign (=) Padding
What happens when the input data length is not evenly divisible by 3 bytes? Base64 uses the equal sign (=) as padding.
If 1 byte remains at the end, two zero-padding bits are appended and two equal signs (==) are added. If 2 bytes remain, four zero bits are appended and one equal sign (=) is added.
5. Standard vs. URL-Safe Base64 (RFC 4648)
Standard Base64 contains the plus sign (+) and forward slash (/), which have reserved functional meanings in URL query strings and URI path segments.
URL-Safe Base64 (RFC 4648 Section 5) replaces + with a hyphen (-) and / with an underscore (_), allowing Base64 tokens and JWT signatures to pass through URLs without percent-encoding.
// Standard to URL-safe Base64 conversion
const urlSafe = base64Str.replace(/\+/g, "-").replace(/\//g, "_").replace(/=+$/, "");Converts standard Base64 to URL-safe format and strips trailing padding.
Frequently Asked Questions
Direct answers to the most common questions people ask online about this topic.
Is Base64 an encryption algorithm?
No. Base64 is an encoding format, not encryption. Anyone can decode a Base64 string instantly with no secret key required.
Can you encode UTF-8 emojis or non-English characters in Base64?
Yes, provided the text is first converted into UTF-8 binary bytes before encoding. Browser btoa() requires encoding string characters via TextEncoder first.
What is the Base64 character alphabet?
Indices 0-25 are uppercase A-Z, 26-51 are lowercase a-z, 52-61 are digits 0-9, 62 is +, and 63 is /.