Text
Base64 Encoder / Decoder
Text or image, live and two-way, correct UTF-8 handling built in. Nothing you paste or upload ever leaves your browser.
Text (0 chars)
Base64 (0 chars)
Base64 shows up everywhere in day-to-day development — API keys and JWT segments, inline image data URIs in CSS, email attachments, config files — but the naive way to encode it in JavaScript, a plain btoa() call, quietly mangles any text outside basic Latin-1, so emoji and accented characters like ä, ö, ü, and é come back corrupted. This tool encodes through the browser's TextEncoder/TextDecoder APIs instead, so Unicode text round-trips exactly, live and two-way as you type in either box. Switch to Image mode to convert an uploaded image into a ready-to-paste data URI for CSS or HTML — with the exact original file bytes, no re-compression — or go the other way and paste a data URI or bare Base64 string to preview and download the decoded image. Because people often paste sensitive tokens or private data into tools like this, everything runs locally in your browser; nothing is ever uploaded to a server.
Related Tools
How to Use
- 1
Choose Text ↔ Base64 or Image ↔ Base64 at the top.
- 2
In Text mode, type in either the Text or Base64 box — the other updates live. Emoji and accented characters round-trip exactly.
- 3
In Image mode, drop in an image to get its Base64 data URI, ready to copy into CSS or HTML.
- 4
Or paste a data URI (or bare Base64 string, picking the image type from the dropdown) into the decode box to preview and download the image it represents.
- 5
Invalid Base64 shows a clear, specific error instead of crashing or producing garbage output.
Frequently Asked Questions
Does this handle emoji and accented characters correctly?
Yes. Encoding text to Base64 with the raw JavaScript btoa() function is a well-known trap — it silently corrupts any character outside the Latin-1 range, so emoji and accents like ä, ö, ü, and é don't round-trip. This tool encodes through TextEncoder/TextDecoder first, so any Unicode text — emoji included — comes back out exactly as it went in.
What happens if I paste invalid Base64?
You get a clear error message instead of a crash or silent garbage output — one message if the text itself isn't valid Base64, and a different one if it's valid Base64 that just doesn't decode to readable text (which usually means it's binary data, like an image, and you should switch to Image mode).
How do I turn an image into a Base64 data URI for CSS?
Switch to Image mode and upload (or drag in) the image. You get the exact original file bytes encoded as a data URI — no re-compression — ready to paste into a background-image: url(...) or an <img src="..."> tag. There's also a one-click copy for just the Base64 payload without the data: prefix.
Can I go the other way — Base64 back into an image file?
Yes. Paste a full data URI or a bare Base64 string into the decode box in Image mode. If you paste a bare string with no data: prefix, pick the image type from the dropdown so it decodes correctly. You get a live preview and a one-click download of the actual image file.
Is it safe to paste sensitive tokens or private data here?
Everything runs locally in your browser's JavaScript engine — nothing you type or upload is ever sent to a server. That's exactly why this matters for Base64: it's a common encoding for API keys, JWTs, and auth headers, and none of that leaves your device. Open your browser's Network tab while using the tool to confirm.
Is there a size limit?
No hard limit, but very large images produce very long Base64 strings — the tool flags this so you can decide whether inlining is really the right call versus linking to a separate file.