Skip to content
U UtilHQ

Base64 Encoder & Decoder

Base64 encoding is a fundamental technique in web development, allowing developers to represent binary data as ASCII text. This is essential for embedding images in HTML/CSS, transmitting files through JSON APIs, encoding authentication credentials, and ensuring data integrity across different systems. While the concept is simple, manually encoding or decoding Base64 can be error-prone and time-consuming. This free Base64 encoder and decoder provides instant, real-time conversion in both directions. Simply paste your text to encode it to Base64, or paste Base64 strings to decode them back to readable text. See character counts, size changes, and get immediate feedback on invalid Base64 input. Perfect for developers working with APIs, email systems, data URLs, or any application that requires Base64 encoding.

100% Free
No Data Stored
Instant Results

Input: 0 characters

What is Base64?

Base64 is an encoding scheme that converts binary data into ASCII text. It uses 64 characters (A-Z, a-z, 0-9, +, /) to represent data. Commonly used for embedding images in HTML/CSS, sending email attachments, and encoding API tokens.

Size Impact

Base64 encoding increases data size by approximately 33%. This is because every 3 bytes of binary data become 4 Base64 characters. Factor this into bandwidth calculations when using Base64 for large files.

Common Use Cases

  • Data URLs: Embed small images directly in HTML/CSS (data:image/png;base64,...)
  • Email Attachments: MIME protocol uses Base64 to send binary files via email
  • API Authentication: Basic Auth headers encode username:password in Base64
  • JSON Data: Safely transmit binary data within JSON (which only supports text)
  • URL Parameters: Pass complex data through URLs without special character issues

Pro Tip: Base64 is NOT encryption. It's encoding for data transmission, not security. Anyone can decode Base64 instantly. For secure data transmission, use proper encryption like AES, then optionally Base64-encode the encrypted result.

Ad Space

What is Base64 Encoding?

Base64 is an encoding method that converts binary data into a text format using 64 printable ASCII characters. The character set consists of:

  • Uppercase letters: A-Z (26 characters)
  • Lowercase letters: a-z (26 characters)
  • Digits: 0-9 (10 characters)
  • Special characters: + and / (2 characters)
  • Padding character: = (used to align the output)

Base64 works by taking every 3 bytes (24 bits) of input data and dividing them into 4 groups of 6 bits each. Each 6-bit group represents a number from 0-63, which maps to one of the 64 characters in the Base64 alphabet.

For example, encoding the word "Man" in Base64:

  • M = 77 (binary: 01001101)
  • a = 97 (binary: 01100001)
  • n = 110 (binary: 01101110)
  • Combined: 010011 010110 000101 101110
  • Base64 indices: 19, 22, 5, 46
  • Base64 result: "TWFu"

The padding character (=) is added when the input length is not divisible by 3, ensuring the output is always a multiple of 4 characters.

Why Base64 Increases File Size by 33%

A crucial aspect of Base64 encoding is understanding its overhead. Because Base64 uses 6 bits per character to represent data (instead of the standard 8 bits per byte), there's an inherent size increase:

  • Input: 3 bytes = 24 bits of data
  • Output: 4 Base64 characters = 32 bits (4 × 8 bits per ASCII character)
  • Efficiency: 24 bits of data requires 32 bits to transmit = 75% efficiency
  • Overhead: 33% increase in size (32/24 = 1.33)

This means a 1 MB binary file becomes approximately 1.33 MB when Base64 encoded. For large files or bandwidth-constrained applications, this overhead matters significantly.

When to worry about overhead:

  • Embedding large images in HTML/CSS (consider external files instead)
  • Mobile applications with limited bandwidth
  • APIs returning large amounts of binary data

When overhead is acceptable:

  • Small images (icons, logos under 10 KB) in CSS
  • Authentication tokens and API keys
  • Email attachments (MIME requires Base64)
  • JSON payloads with small binary blobs

Common Base64 Use Cases in Development

1. Data URLs for Images:

Embedding small images directly in HTML or CSS eliminates HTTP requests:

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

Best for: Icons, small logos, inline SVGs. Avoid for: Large photos, hero images.

2. HTTP Basic Authentication:

The Authorization header encodes credentials as Base64:

Authorization: Basic dXNlcm5hbWU6cGFzc3dvcmQ=

Note: Base64 is NOT encryption. HTTPS is required for security.

3. JSON with Binary Data:

JSON only supports text, so binary data (images, PDFs) must be Base64 encoded:

{
  "filename": "document.pdf",
  "content": "JVBERi0xLjQKJeLjz9MK..."
}

4. Email Attachments (MIME):

Email protocols were designed for 7-bit ASCII text. MIME uses Base64 to send binary attachments:

Content-Type: application/pdf
Content-Transfer-Encoding: base64

JVBERi0xLjQKJeLjz9MK...

5. CSS Background Images:

Reduce HTTP requests by embedding small backgrounds:

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

6. Storing Binary Data in Databases:

Some databases (especially older ones) store binary data as Base64 text fields to avoid BLOB complexity.

Base64 vs URL-Safe Base64

Standard Base64 uses + and / characters, which have special meaning in URLs. For URL parameters or filenames, use URL-safe Base64 (also called Base64URL):

  • Standard Base64: + and /
  • URL-safe Base64: - and _ (hyphen and underscore)
  • Padding: Often omitted in URL-safe variant

Example:

  • Standard: a+b/c==
  • URL-safe: a-b_c (padding removed)

Used in: JWT tokens, OAuth, Google APIs, file-safe identifiers.

JavaScript Conversion:

// Standard to URL-safe
const urlSafe = base64.replace(/+/g, '-').replace(///g, '_').replace(/=/g, '');

// URL-safe to Standard
let standard = urlSafe.replace(/-/g, '+').replace(/_/g, '/');
while (standard.length % 4) standard += '=';

Frequently Asked Questions

Is Base64 encryption or encoding?
Base64 is encoding, NOT encryption. Encoding transforms data into a different format (binary to text), while encryption secures data so only authorized parties can read it. Anyone can decode Base64 instantly without a key. Base64 is designed for data transmission compatibility, not security. If you need secure data, use proper encryption algorithms (AES, RSA) and then optionally Base64-encode the encrypted result for transmission.
What is Base64 used for?
Base64 is used to encode binary data as text for systems that only support text. Common uses include: 1) Embedding images in HTML/CSS as data URLs, 2) Email attachments via MIME encoding, 3) HTTP Basic Authentication headers, 4) Transmitting binary data in JSON APIs, 5) URL-safe encoding of tokens and IDs, 6) Storing binary data in text-based databases. Base64 ensures binary data can travel through text-only channels without corruption.
Why does Base64 make files larger?
Base64 increases file size by approximately 33% because it uses 6 bits per character to represent data instead of 8 bits. Every 3 bytes (24 bits) of input becomes 4 Base64 characters (32 bits total when transmitted as ASCII). This means you need 4 bytes to transmit what was originally 3 bytes of data: 4/3 = 1.33, or a 33% increase. This is the trade-off for making binary data safe for text-based systems.
Can Base64 encoded data be decoded?
Yes, absolutely. Base64 is a reversible encoding, not encryption. Anyone with the Base64 string can decode it back to the original data using standard decoding functions available in all programming languages. There is no key or secret required. If you see Base64-encoded data, assume it can be read by anyone. Never use Base64 alone to protect sensitive information like passwords or private keys - use proper encryption instead.
How do I decode Base64 in JavaScript?
In modern browsers, use atob() to decode: const decoded = atob("SGVsbG8gV29ybGQ="); // "Hello World". To handle Unicode properly, wrap it: const text = decodeURIComponent(escape(atob(base64String))). In Node.js, use Buffer: const decoded = Buffer.from(base64String, "base64").toString("utf8"). For encoding, use btoa() in browsers or Buffer.from(text, "utf8").toString("base64") in Node.js.
What does the = sign mean in Base64?
The equals sign (=) is padding used when the input data length is not divisible by 3. Base64 processes data in 3-byte chunks (24 bits), which become 4 characters (6 bits each). If the last chunk has only 1 or 2 bytes, padding is added: 1 byte of data = 2 Base64 chars + "==", 2 bytes of data = 3 Base64 chars + "=". The padding ensures the output length is always a multiple of 4 characters, making parsing easier. Some systems (like URL-safe Base64) omit padding.