What is Base64 Encoding? Complete Guide with Examples

Base64 is one of those terms that comes up constantly in web development — in APIs, JWT tokens, email attachments, and image embedding — yet many developers use it without fully understanding what it is or why it exists. This guide covers everything.

What is Base64?

Base64 is an encoding scheme that converts binary data into a string of ASCII characters. It uses 64 characters: A–Z, a–z, 0–9, +, and /, plus = for padding.

The name "Base64" comes from the fact that it uses a 64-character alphabet to represent data.

Why Does Base64 Exist?

Many systems were designed to handle text, not binary data. Email protocols, HTTP headers, and URLs all have restrictions on what characters they can carry. Base64 solves this by converting binary data (like images or files) into plain text that travels safely through any system.

How Base64 Works

Base64 takes 3 bytes of binary data (24 bits) and converts them into 4 Base64 characters (6 bits each). This means Base64 output is always ~33% larger than the original.

Original: "Hi!" (3 bytes = 24 bits)
Binary:   01001000 01101001 00100001
Groups:   010010 000110 100100 100001
Base64:   S      G      k      h
Output:   "SGkh"

Common Use Cases

1. Embedding images in HTML/CSS

Instead of a separate HTTP request for a small image, you can embed it directly:

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

2. API authentication headers

HTTP Basic Auth encodes credentials as Base64:

Authorization: Basic dXNlcm5hbWU6cGFzc3dvcmQ=
# Decodes to: username:password

3. JWT tokens

JSON Web Tokens (JWTs) use Base64URL encoding for their header and payload sections:

eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiIxMjM0In0.SflKxw...
^-- Header (Base64)              ^-- Payload (Base64)

4. Sending binary files in JSON APIs

When an API only accepts JSON, you can Base64-encode a file and send it as a string field.

Base64 in Code

JavaScript (browser)

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

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

Python

import base64

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

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

Base64URL vs Base64

Standard Base64 uses + and / which are special characters in URLs. Base64URL replaces them with - and _, making it safe to use in URLs and JWT tokens without percent-encoding.