What is Base64?
Base64 is a way of representing binary data using only 64 printable ASCII characters (A–Z, a–z, 0–9, plus + and /, with = for padding). It exists because a lot of the internet’s plumbing — email bodies, HTTP headers, JSON string fields, URLs — was designed for text, not raw bytes. Send raw binary through those channels and it can get mangled. Base64 wraps the bytes in a safe text envelope so they survive the trip intact.
The Base64 Encoder/Decoder lets you convert text to Base64 and back instantly, in your browser, with full Unicode support. This guide explains how to use it, what’s happening under the hood, and the one bug that trips up almost everyone who tries to do this with raw JavaScript.
Using the tool
- Choose a mode. Select Encode to turn plain text into Base64, or Decode to turn Base64 back into text.
- Type or paste your input into the left panel.
- Read the result in the right panel — it updates as you type, no button needed.
- Copy the output with one click, or use Swap & Flip to move the current output into the input and reverse the operation. That makes round-tripping (encode, then decode to verify) a two-click check.
The output length is shown so you can quickly compare sizes, and the result is rendered in a monospace font so long encoded strings are easy to scan.
The Unicode trap (and why this tool avoids it)
If you’ve ever reached for the browser’s built-in btoa() function, you may have hit this:
btoa("Café 🎉"); // ❌ throws: characters outside Latin-1
btoa() only understands characters in the Latin-1 (ISO-8859-1) range. Give it an emoji, a curly quote, or most non-English text and it throws an error. The fix is to convert the text to UTF-8 bytes first, then Base64-encode those bytes:
const bytes = new TextEncoder().encode("Café 🎉");
const b64 = btoa(String.fromCharCode(...bytes)); // ✅ works
The Tools.Town encoder does exactly this with TextEncoder/TextDecoder, so emojis, accented characters, and non-Latin scripts all encode and decode losslessly. You never have to think about it — but knowing why it works helps when you’re debugging the same problem in your own code.
Base64 is encoding, not encryption. Anyone can decode it in seconds. Never use Base64 to “hide” passwords, tokens, or personal data — it provides zero confidentiality.
Where Base64 shows up
- Data URIs. Embed a small image or font directly in HTML/CSS as
data:image/png;base64,…, saving an HTTP request. - HTTP Basic Auth. The
Authorization: Basicheader is justusername:passwordBase64-encoded (which is exactly why Basic Auth must run over HTTPS — see the warning above). - JWTs. JSON Web Tokens are three Base64URL-encoded segments joined by dots. Decoding the middle segment reveals the token’s claims — handy for debugging.
- Email attachments. MIME encodes attachments in Base64 so binary files survive text-only mail transport.
- Config and
.envvalues. Certificates and keys are often stored Base64-encoded so they fit on a single line.
Base64 vs Base64URL
Standard Base64 uses + and /, which have special meanings in URLs. Base64URL swaps them for - and _ and usually drops the = padding, so the result is safe to drop into a query string or path. JWTs use Base64URL. If you’re decoding a token and the characters look slightly different, that’s why.
The 33% size rule
Base64 turns every 3 bytes into 4 characters, so encoded data is roughly 33% larger than the original. That overhead is the price of text safety. It’s why you Base64-encode small images into data URIs but serve large ones as normal files — past a few kilobytes, the inflation outweighs the saved request.
Privacy
Encoding and decoding happen entirely in your browser via a pure function — open the network tab and you’ll see zero requests as you type. Nothing you paste into the Base64 Encoder/Decoder is uploaded or stored, which makes it safe for config snippets and tokens you’re inspecting locally.
Related reading
For a broader look at how text and binary representations relate, see the binary encoding guide. And if you frequently inspect tokens, pair this tool with a JWT decoder to read the Base64URL segments directly.
Frequently asked questions
The FAQs above cover the essentials — Base64 is not encryption, why btoa() breaks on emojis, the 33% size overhead, and the client-side privacy guarantee. When in doubt, remember the one-line summary: Base64 makes binary safe for text channels; it does nothing to keep it secret.