Base64 Encoding: What It Is and When to Use It

What Is Base64?

Base64 is a way to represent binary data using only text characters. It takes any data (images, files, raw bytes) and converts it into a string made up of letters (A-Z, a-z), numbers (0-9), plus signs (+), and slashes (/). The result is always plain ASCII text that can safely travel through systems designed for text, like email, JSON, and HTML.

How It Works

The encoding process takes every 3 bytes of input and converts them into 4 Base64 characters. Each character represents 6 bits of data (2^6 = 64 possible values, hence the name). If the input length isn't divisible by 3, the output gets padded with one or two equals signs (=) at the end.

This means Base64 encoded data is always about 33% larger than the original. Three bytes become four characters. That's the main tradeoff: you get text compatibility at the cost of increased size.

Data URLs

The most common use of Base64 on the web is data URLs. Instead of pointing to an external file, you embed the file directly in your HTML or CSS:

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

The format is: data:[mime-type];base64,[encoded-data]

This eliminates an HTTP request, which can be useful for tiny images like icons or simple graphics. But for anything larger than a few KB, the size overhead makes a separate file the better choice.

When to Use Base64

Small inline images. Icons under 1-2KB are good candidates for data URLs. The saved HTTP request is worth the size increase.

Email attachments. Email protocols are text-based, so binary attachments must be Base64 encoded. Your email client does this automatically.

JSON payloads. When an API needs to accept or return binary data inside JSON (which only supports text), Base64 is the standard approach.

Storing binary in text fields. If you need to put a small binary value in a database text column or a config file, Base64 works well.

When Not to Use Base64

Large files. The 33% size increase adds up fast. A 1MB image becomes 1.33MB as Base64, and it can't be cached separately by the browser.

Performance-critical paths. Encoding and decoding Base64 takes CPU time. For high-throughput applications, binary transfer is more efficient.

When a URL will do. If you can serve the file normally and link to it, that's almost always better than embedding it as Base64.

Try It Out

Our Base64 tool lets you encode files and text to Base64, or decode Base64 strings back to their original form. It shows you the size comparison so you can see exactly how much overhead Base64 adds. Everything runs in your browser.