Base64 Encoding Explained with Examples

Base64 encoding is one of the most common data encoding schemes in software development. You encounter it in data URIs, JWT tokens, email attachments, API payloads, and HTTP Basic Authentication — yet many developers use it without fully understanding what it does or, more importantly, what it doesn’t do (hint: it is not encryption). This guide explains how Base64 works step by step, covers all the common use cases, shows code examples in JavaScript, Python, Go, and the command line, and highlights the mistakes developers make most often. To encode or decode Base64 strings right now, try our Base64 Encoder and Base64 Decoder.

What Is Base64?

Base64 is a binary-to-text encoding that represents binary data using only 64 ASCII characters: A-Z, a-z, 0-9, +, and /, plus = for padding.

Its purpose is simple: safely transport binary data through systems that only handle text. Email protocols, JSON payloads, HTML attributes, and URLs all expect printable ASCII — they’ll corrupt or reject raw binary. Base64 solves this by converting any binary input into a safe text representation.

The name comes from the 64-character alphabet. Each Base64 character encodes exactly 6 bits (2⁶ = 64), so every 3 bytes of input produce 4 characters of output. This means Base64 output is always ~33% larger than the original data.

How It Works

The encoding process has three steps:

1. Take 3 bytes (24 bits) of input
2. Split into 4 groups of 6 bits each
3. Map each group to a character from the Base64 alphabet

Input:    M           a           n
ASCII:    77          97          110
Binary:   01001101    01100001    01101110

Split into 6-bit groups:
010011  010110  000101  101110

Base64:   T       W       F       u

If the input length isn’t a multiple of 3, padding with = is added:

• 1 byte remaining → 2 Base64 chars + ==
• 2 bytes remaining → 3 Base64 chars + =
• 0 bytes remaining → no padding

That’s why you often see Base64 strings ending in = or ==.

Encoding in Different Languages

JavaScript (Browser & Node.js)

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

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

// For Unicode text (btoa only handles Latin-1):
const unicodeEncode = (str) =>
  btoa(new TextEncoder().encode(str).reduce(
    (data, byte) => data + String.fromCharCode(byte), ''
  ));

Python

import base64

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

# Decode
decoded = base64.b64decode("SGVsbG8sIFdvcmxkIQ==").decode()
# "Hello, World!"

# URL-safe variant
url_safe = base64.urlsafe_b64encode(b"data with +/=").decode()

Go

import "encoding/base64"

// Encode
encoded := base64.StdEncoding.EncodeToString([]byte("Hello, World!"))

// Decode
decoded, err := base64.StdEncoding.DecodeString(encoded)

// URL-safe variant
urlSafe := base64.URLEncoding.EncodeToString(data)

Command Line

# Encode
echo -n "Hello, World!" | base64
# SGVsbG8sIFdvcmxkIQ==

# Decode
echo "SGVsbG8sIFdvcmxkIQ==" | base64 -d
# Hello, World!

# Encode a file
base64 image.png > image.b64

# Decode a file
base64 -d image.b64 > image.png

Where Base64 Is Used

Data URIs in HTML/CSS

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

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

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

Best for icons under 2-4 KB. Larger images are better served as separate files — Base64 inflates the size by 33% and prevents browser caching.

Email Attachments (MIME)

Email was designed for plain text. Binary attachments (images, PDFs, ZIPs) are Base64-encoded in MIME messages. Every email with an attachment uses Base64 under the hood.

JSON Web Tokens (JWT)

JWTs use Base64url encoding (a URL-safe variant) for the header and payload:

eyJhbGciOiJIUzI1NiJ9.eyJzdWIiOiIxMjM0NSJ9.signature

Each segment before the dots is a Base64url-encoded JSON object. You can decode them with our JWT Decoder.

API Payloads

When APIs need to transport binary data (images, files, certificates) inside JSON, Base64 is the standard approach since JSON doesn’t support raw binary.

HTTP Basic Authentication

The Authorization header encodes username:password in Base64:

Authorization: Basic dXNlcjpwYXNzd29yZA==

This is encoding, not encryption — anyone can decode it. Always use HTTPS.

Base64 Variants

The URL-safe variant exists because +, /, and = have special meaning in URLs and would need percent-encoding, defeating the purpose.

Common Mistakes

Mistake 1: Using Base64 for “encryption”

Base64 is not encryption. It provides zero security — decoding is trivial and instant. If you need to protect data, use actual encryption (AES, RSA) and then Base64-encode the ciphertext if needed for transport.

Mistake 2: Base64-encoding large files for APIs

Encoding a 10 MB file as Base64 produces ~13.3 MB of text that must be held entirely in memory. For large files, use multipart/form-data upload or streaming instead.

Mistake 3: Forgetting about Unicode

JavaScript’s btoa() throws an error on non-Latin-1 characters. Encode UTF-8 text to bytes first (see the JavaScript example above). Python’s base64.b64encode() expects bytes, not str.

Mistake 4: Double-encoding

Check if your framework or library already Base64-encodes data before adding your own encoding. Double-encoded Base64 looks like valid Base64 but decodes to gibberish.

Size Overhead

Base64 always increases data size:

The ratio is constant: output = input × 4/3, rounded up to the next multiple of 4 (due to padding).

Try It Yourself

Encode or decode Base64 strings instantly with our browser-based tools:

• Base64 Encoder — convert text to Base64
• Base64 Decoder — convert Base64 back to text

Further Reading

• RFC 4648 — The Base16, Base32, and Base64 Data Encodings — the official specification
• MDN: btoa() — JavaScript Base64 encoding
• MDN: atob() — JavaScript Base64 decoding