Base64 Encoding: What It Is and When to Use It

Base64 encoding converts binary data into a text format using 64 printable ASCII characters. If you've worked with APIs, data URIs, JWT tokens, or email systems, you've encountered Base64 — whether you realized it or not.

How Base64 Works

Base64 encoding takes binary data and represents it using only these 64 characters:

A-Z (26) + a-z (26) + 0-9 (10) + + / (2) = 64 characters

Plus = as a padding character.

The Encoding Process

1. Take the input bytes
2. Split into groups of 3 bytes (24 bits)
3. Divide each 24-bit group into 4 groups of 6 bits
4. Map each 6-bit value (0-63) to a character in the Base64 alphabet
5. If the input isn't divisible by 3, pad with =

Example

Let's encode the string "Hi":

Text:    H        i
ASCII:   72       105
Binary:  01001000 01101001

Split into 6-bit groups:
010010 000110 1001xx

Pad the last group with zeros:
010010 000110 100100

Base64 index: 18  6  36
Character:    S   G   k

Add padding (input was 2 bytes, not 3):
Result: SGk=

Key Properties

• Output is always about 33% larger than the input
• Base64 is encoding, not encryption — it provides no security
• The output is reversible — anyone can decode it

Common Use Cases

1. Data URIs

Embed small images directly in HTML or CSS without additional HTTP requests:

<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUg..." alt="Icon" />

.icon {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB...");
}

When to use: For small icons and images under 2-3KB. Larger images are better served as separate files.

2. API Authentication

HTTP Basic Authentication sends credentials as a Base64-encoded string:

Authorization: Basic dXNlcm5hbWU6cGFzc3dvcmQ=

This is username:password encoded in Base64. Remember — this is not encryption. Always use HTTPS with Basic Auth.

3. JWT Tokens

JSON Web Tokens use Base64URL encoding (a URL-safe variant) for their three parts:

eyJhbGciOiJIUzI1NiJ9.eyJ1c2VyIjoiamFuZSJ9.signature

Each part (header, payload, signature) is Base64URL-encoded. You can decode the header and payload to inspect the token's contents without verifying it.

4. Email Attachments (MIME)

Email was designed for text, not binary data. MIME encoding uses Base64 to send attachments (images, PDFs, documents) through email protocols that only support ASCII text.

5. Embedding Binary Data in JSON/XML

JSON doesn't support binary data natively. When you need to include a file in a JSON payload (like uploading an avatar via an API), Base64 encoding is the standard approach:

{
  "filename": "avatar.png",
  "content": "iVBORw0KGgoAAAANSUhEUg..."
}

6. Storing Binary Data in Text Fields

Databases, configuration files, and other text-based storage can hold binary data when it's Base64-encoded.

Base64 in JavaScript

Browser (Web APIs)

// Encode
const encoded = btoa("Hello, World!");
console.log(encoded); // "SGVsbG8sIFdvcmxkIQ=="

// Decode
const decoded = atob("SGVsbG8sIFdvcmxkIQ==");
console.log(decoded); // "Hello, World!"

Note: btoa() and atob() only work with ASCII strings. For Unicode:

// Encode Unicode
const encoded = btoa(unescape(encodeURIComponent("Hello, 世界!")));

// Decode Unicode
const decoded = decodeURIComponent(escape(atob(encoded)));

Node.js

// Encode
const encoded = Buffer.from("Hello, World!").toString("base64");

// Decode
const decoded = Buffer.from(encoded, "base64").toString("utf-8");

// Encode a file
const fs = require("fs");
const fileBase64 = fs.readFileSync("image.png").toString("base64");

Base64 in Python

import base64

# Encode
encoded = base64.b64encode(b"Hello, World!").decode("utf-8")
print(encoded)  # SGVsbG8sIFdvcmxkIQ==

# Decode
decoded = base64.b64decode(encoded).decode("utf-8")
print(decoded)  # Hello, World!

# Encode a file
with open("image.png", "rb") as f:
    file_base64 = base64.b64encode(f.read()).decode("utf-8")

Base64 Variants

The URL-safe variant replaces + with - and / with _ to avoid conflicts with URL syntax.

When NOT to Use Base64

• Encryption — Base64 is trivially reversible. Use actual encryption (AES, RSA) for security.
• Large files — the 33% size overhead makes Base64 impractical for large binary data. Use multipart uploads instead.
• Compression — Base64 encoding actually increases size. Compress first, then encode if needed.
• Passwords — storing passwords as Base64 is dangerously insecure. Use bcrypt or Argon2 hashing.

Common Mistakes

Confusing Encoding with Encryption

"SSBhbSBub3QgZW5jcnlwdGVk" is NOT secure.
It's just "I am not encrypted" in Base64.

Anyone can decode Base64. It provides zero confidentiality.

Double Encoding

Base64-encoding something that's already Base64-encoded creates a mess. Always know the state of your data before encoding or decoding.

Ignoring the Size Overhead

A 1MB image becomes ~1.37MB when Base64-encoded. For data URIs, this overhead is usually offset by saving an HTTP request — but only for small files.

Try It Yourself

Our free Base64 Encoder/Decoder lets you encode and decode text and files instantly in your browser. It handles standard and URL-safe variants, and works entirely client-side — nothing is sent to any server.

Whether you're debugging a JWT token, embedding a small image, or preparing API payloads, having a reliable Base64 tool is essential.