Understanding Base64 Encoding & Decoding

๐Ÿ“– 7 min read ยท Data Formats ยท Try Base64 Tool โ†’

What is Base64?

Base64 is a binary-to-text encoding scheme that converts binary data into a string of 64 printable ASCII characters. The name comes from the 64 characters used in the encoding alphabet: Aโ€“Z (26), aโ€“z (26), 0โ€“9 (10), + and / (2), with = used as padding. It was designed to allow binary data to be safely transmitted over systems that only support text, such as email (MIME), HTTP headers, and XML/JSON payloads.

Base64 is not encryption. It is a reversible encoding that anyone can decode without a key. Never use Base64 to protect sensitive data.

How Base64 Encoding Works

Base64 works by taking 3 bytes (24 bits) of binary data at a time and splitting them into four 6-bit groups. Each 6-bit group maps to one of the 64 characters in the Base64 alphabet.

Example: Encoding "Man"

"Man" in ASCII:  M=77, a=97, n=110
Binary:          01001101 01100001 01101110
Split into 6-bit: 010011 010110 000101 101110
Base64 index:     19     22     5      46
Base64 chars:     T      W      F      u
Result: "TWFu"

If the input is not divisible by 3, padding characters (=) are added to make the output length a multiple of 4.

Common Use Cases

Data URLs for images

Embed images directly in HTML or CSS without separate HTTP requests. Example: <img src="data:image/png;base64,iVBORw0KGgo...">. Best for small icons and logos.

HTTP Basic Authentication

Credentials are Base64-encoded in the Authorization header: Authorization: Basic dXNlcjpwYXNzd29yZA==. Note: this is encoding, not encryption โ€” always use HTTPS.

Email attachments (MIME)

Email protocols are text-based. Binary attachments (PDFs, images) are Base64-encoded before being embedded in email messages.

JSON API payloads

When an API needs to transmit binary data (like file contents or images) in a JSON body, Base64 encoding converts the binary to a safe string.

JWT tokens

The header and payload of JWT tokens are Base64URL-encoded (a URL-safe variant that replaces + with - and / with _).

Storing binary data in text formats

XML, CSV, and other text-based formats cannot contain raw binary data. Base64 encoding allows binary data to be stored safely.

Base64 Size Overhead

Base64 encoding increases data size by approximately 33%. Every 3 bytes of input becomes 4 bytes of Base64 output. For a 1MB image, the Base64 representation is approximately 1.37MB.

This overhead means Base64 is not suitable for large files. For large binary transfers, use multipart form data or binary protocols instead.

Base64 vs Base64URL

Standard Base64 uses + and / characters which have special meaning in URLs. Base64URL is a URL-safe variant that replaces + with - and / with _, and omits padding =. It is used in JWTs, OAuth tokens, and URL parameters.

Base64 in JavaScript

// Encode
const encoded = btoa('Hello, World!');
// "SGVsbG8sIFdvcmxkIQ=="

// Decode
const decoded = atob('SGVsbG8sIFdvcmxkIQ==');
// "Hello, World!"

// For binary data (Node.js)
const buf = Buffer.from('Hello');
const b64 = buf.toString('base64');
const original = Buffer.from(b64, 'base64').toString();

Encode & Decode Base64 Online

Convert text and images to Base64 instantly in your browser.