Base64 encoding is one of those things every developer encounters but few fully understand. Whether you've seen it in JWT tokens, data URIs, API headers, or email attachments, Base64 is everywhere. This guide explains what it is, how it works, and when you should use it.

What is Base64 Encoding?

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

Base64 encoding converts every 3 bytes of binary data into 4 ASCII characters. This means Base64-encoded data is about 33% larger than the original.

For example:

Original: Hello, World!
Base64:   SGVsbG8sIFdvcmxkIQ==

How Base64 Encoding Works

The encoding process follows these steps:

Take 3 bytes (24 bits) of input data
Split into 4 groups of 6 bits each
Map each 6-bit group to a character in the Base64 alphabet
If the input isn't a multiple of 3, add padding (=) characters

The Base64 alphabet:

ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/

When Developers Use Base64

1. Data URIs (Embedding Images in CSS/HTML)

Base64 lets you embed images directly in HTML or CSS without separate HTTP requests:

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

This is useful for small icons and sprites. For larger images, separate files are more efficient. Use ToolCove's Image to Base64 Converter to generate data URIs.

2. JWT Tokens

JSON Web Tokens use Base64URL encoding (a URL-safe variant) for their header and payload segments. When you decode a JWT, you're essentially Base64-decoding each segment and parsing the resulting JSON.

3. API Authentication Headers

HTTP Basic Authentication encodes username:password as Base64:

Authorization: Basic dXNlcm5hbWU6cGFzc3dvcmQ=

Note: Base64 is encoding, not encryption. Anyone can decode it. Always use HTTPS.

4. Email Attachments (MIME)

Email protocols (SMTP) only support 7-bit ASCII text. Binary attachments are Base64-encoded so they can travel safely through email servers.

5. Storing Binary Data in JSON/XML

JSON and XML are text formats that can't contain raw binary data. Base64 encoding lets you include binary content (images, files, certificates) in JSON payloads.

How to Encode and Decode Base64 Online

Go to the Base64 Encoder/Decoder
Paste your text in the input field
Select "Encode" to convert text to Base64, or "Decode" for the reverse
Results appear instantly — copy with one click

Base64 in JavaScript

JavaScript provides built-in functions for Base64:

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

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

// For Unicode strings (the safe way):
function encodeUnicode(str) {
  return btoa(encodeURIComponent(str).replace(/%([0-9A-F]{2})/g, (_, p1) =>
    String.fromCharCode(parseInt(p1, 16))
  ));
}

Base64 vs Base64URL

Standard Base64 uses + and / characters, which are unsafe in URLs. Base64URL replaces them:

+ → -
/ → _
Padding (=) is often omitted

Base64URL is used in JWTs, URL parameters, and filenames.

Common Mistakes

Treating Base64 as encryption — it's encoding, not security. Anyone can decode it.
Base64-encoding large files — the 33% size increase matters for large payloads
Ignoring Unicode — btoa() fails on non-ASCII characters; use the wrapper above
Double-encoding — encoding already-encoded data creates longer, invalid strings

Related Tools

Base64 Encoder/Decoder — encode and decode Base64 strings instantly
Image to Base64 Converter — convert images to data URIs
JWT Decoder — decode Base64URL-encoded JWT tokens
URL Encoder/Decoder — encode special characters in URLs

Base64 Encoding Explained: When and Why Developers Use It