Base64 shows up constantly in web development. You see it in JWT tokens, email attachments, data URLs in HTML, and API authentication headers. But most developers learn to copy-paste it rather than understanding what it actually does. This article explains the mechanics, the common uses, and the important limits of Base64.
How Base64 Works
Base64 is an encoding scheme that represents binary data as ASCII text. It does this by taking three bytes (24 bits) of input at a time and splitting them into four 6-bit groups. Each 6-bit group maps to one of 64 printable characters: A–Z, a–z, 0–9, +, and /. The name comes from this 64-character alphabet.
Because three bytes become four characters, Base64-encoded data is always approximately one-third larger than the original. If the input is not a multiple of three bytes, padding characters (=) are added to make the output length a multiple of four. Decoding is the reverse: strip padding, convert each character back to its 6-bit value, reassemble the 24-bit groups, and split them back into bytes.
Common Uses for Base64
Base64 exists because many data transport channels were originally designed to carry text, not arbitrary binary data. Email infrastructure, for example, was built for 7-bit ASCII and cannot reliably pass binary bytes. Embedding an image or PDF in an email requires encoding the binary data as text that survives transit intact.
- Email attachments use MIME's Base64 Content-Transfer-Encoding to send binary files.
- Data URLs (data:image/png;base64,...) embed images directly in HTML and CSS without a separate HTTP request.
- JWT tokens encode their JSON header and payload as Base64url (a URL-safe variant).
- HTTP Basic Authentication encodes username:password in Base64 in the Authorization header.
- Binary values in JSON fields (such as encrypted data or file contents) are Base64-encoded because JSON has no binary type.
Base64 Is Not Encryption
This is the most important point. Base64 is an encoding, not encryption. It has no key, no secret, and no security. Anyone who sees a Base64-encoded value can decode it in one step using any Base64 decoder. The encoding is completely reversible and standardized — there is nothing secret about how it works.
You will occasionally see credentials, tokens, or configuration values stored as Base64 as if it provides some protection. It does not. If a secret is Base64-encoded, it is effectively in plaintext. Always use actual encryption (AES, RSA) with a proper key when confidentiality is required.
Base64url: The URL-Safe Variant
Standard Base64 uses + and / as two of its 64 characters. These characters have special meaning in URLs: + is interpreted as a space in some contexts, and / is a path separator. Base64url replaces + with - and / with _ to produce output that can appear in URLs and filenames without encoding. It also typically omits the trailing = padding.
JWT tokens use Base64url encoding for their header and payload segments. If you are decoding a JWT manually, remember to replace - with + and _ with / before feeding the string to a standard Base64 decoder.
When to Avoid Base64
For small values (icons, small images) in a performance-critical page, data URLs can save HTTP requests and improve load time. But Base64 increases size by 33%, and that overhead adds up. Encoding a 100 KB image as a Base64 data URL produces a 133 KB string that must be parsed as text before the browser can decode and render it. For images larger than a few kilobytes, serving them as separate files with proper caching is almost always faster.