What Is Base64 Encoding and When Do You Need It?
SGVsbG8sIHdvcmxkIQ== looks like gibberish, but it's just "Hello, world!" wearing a disguise. That disguise is Base64 — one of the most common encodings on the internet, and one of the most misunderstood. Let's fix that in five minutes.
The One-Sentence Explanation
Base64 converts any data — text, images, binaries — into a string made only from 64 safe ASCII characters (A-Z, a-z, 0-9, +, /), so it can travel through systems designed to carry plain text.
Why Does That Matter?
Many internet protocols were built in an era when "data" meant "English text." Email, JSON, XML, URLs, HTTP headers — none of them safely carry raw binary bytes. Try pasting a photo into a JSON field and the bytes will corrupt the structure. Base64 wraps binary data in characters that every text system handles without choking.
You've met it in the wild even if you didn't notice:
- Data URIs: images embedded directly in CSS or HTML as
data:image/png;base64,... - JWT tokens: the header and payload sections of a JSON Web Token are Base64URL-encoded JSON
- Email attachments: every attachment you send is Base64'd under the hood (MIME)
- Basic auth: the
Authorization: Basic ...header is Base64 of "username:password" - API payloads: file uploads inside JSON requests
The Catch: It's 33% Bigger
Base64 packs 3 bytes into 4 characters. That math means any Base64 string is about 33% larger than the original data. A 100KB image becomes a 133KB string. This is why embedding huge images as data URIs is an anti-pattern — keep inline images small (icons, tiny logos) and link the big ones.
Base64 Is Not Encryption
This is the dangerous misconception. Base64 is a public, reversible transform — anyone can decode it in one second, no key required. If a "security" system hides secrets in Base64, those secrets are plain text with extra steps. Use Base64 for transport, never for protection.
How to Encode and Decode
The Base64 encoder/decoder on this site runs entirely in your browser — important when you're decoding a JWT that contains session data:
- Paste text and click Encode → to get Base64, or paste Base64 and click ← Decode to read it.
- Unicode works correctly — Chinese, emoji, and accented characters encode as UTF-8 first, so nothing gets mangled.
- Need an image as a data URL? Use the file picker below the panels and it outputs the complete
data:image/...;base64,string ready to paste into CSS or HTML.
Decoding Fails? Check These
- Truncation: Base64 strings end with zero to two
=padding characters. A cut-off string won't decode cleanly. - Base64URL variant: JWTs replace
+and/with-and_. Swap them back before decoding. - Stray whitespace: line breaks pasted from PEM files can confuse strict decoders — strip them first.