Base64 · Encode · Decode · Cast

Every byte, set in type.

Paste text, Base64, or an image data URL — the foundry sniffs the format and casts it the right way. Native UTF-8 bridging keeps Chinese and emoji intact, and the workshop turns images into ready-to-use data URLs.

  • UTF-8 bridge — Chinese & emoji safe
  • Auto-detects text, Base64 & data:image
  • Image → Canvas → data URL, 100% local
base64deco — the type case job nº 001 idle
atob/btoa cannot speak UTF-8 — the bridge can
auto — paste text, Base64, or a data:image URL
Input
0 chars · 0 lines
Output
// Output appears here — the bridge detects your input automatically: // text → Base64, Base64 → text, data:image → preview.
Image Workshop — image → type
drop · canvas · rgba · data url
Drop an image here, or click to browse
PNG · JPEG · WebP · GIF · SVG — everything stays on your machine
§ 01 — FOUNDRY PRACTICES

Built for real-world payloads

The features you need when bytes meet text — multilingual copy, tokens, and embedded assets.

UTF-8 Bridge

Native atob() mangles Chinese and emoji. Every conversion passes through TextEncoder / TextDecoder, so multi-byte characters survive intact — both ways.

Smart Sniffing

Paste anything. data:image payloads get a preview card, Base64 gets decoded, plain text gets encoded — structural hints and a test-decode settle ambiguous cases.

Image Workshop

Drop an image and it is cast on a Canvas — RGBA pixel data extracted, re-encoded as PNG, JPEG or WebP, and delivered as a data URL ready for <img src>.

URL-Safe Mode

One toggle swaps + / for - _ so the output travels inside URLs, JWTs and filenames. The decoder accepts both variants automatically.

§ 02 — THE TYPE CASE

The 64-character alphabet

Every Base64 digit is one of these 64 sorts — index 62 (+) and 63 (/) are the two that change in URL-safe mode.

A–Z → 0–25 · a–z → 26–51 · 0–9 → 52–61 · + → 62 · / → 63 — 6 bits per character, 3 bytes per 4 characters.

§ 03 — FOUNDRY NOTES

Frequently Asked Questions

How do I encode text to Base64?

Paste or type your text into the input pane. Base64Deco detects plain text automatically and encodes it instantly — the output pane shows the Base64 string with character and byte counts. One click copies it to your clipboard.

How do I decode Base64 back to text?

Paste a Base64 string — with or without padding, with or without line breaks. The auto detector recognizes it as a Base64 payload and decodes it. You can also lock the direction with the Encode / Decode tabs, or swap the output back into the input to verify a round trip.

Why does atob() garble Chinese characters and emoji?

The browser's native atob() treats every character as one byte (Latin-1). Chinese and emoji are encoded as multi-byte UTF-8 sequences, so atob() splits them at the wrong boundaries and produces mojibake. Base64Deco bridges this: encoding goes through TextEncoder to get the UTF-8 byte stream before Base64 mapping, and decoding converts the bytes back through TextDecoder. 你好 and 🎉 survive every trip.

How does Auto mode detect what I pasted?

The sniffer checks three things in order. If the input starts with data:image it is treated as an image data URL and previewed. If it contains characters outside the Base64 alphabet (Chinese text, punctuation, spaces) it is treated as text to encode. If it is pure Base64 alphabet characters, structural hints (padding, URL-safe characters) decide — and ambiguous cases are test-decoded: only clean, printable results count as Base64.

How do I turn an image into a Base64 data URL?

Drop an image onto the Image Workshop (or the input pane) or click to browse. The image is drawn onto a Canvas, its RGBA pixel data is extracted and encoded as Base64, and a standard data URL is produced — ready to paste into an img tag's src attribute. Choose PNG, JPEG or WebP output, adjust quality, and copy or download the result.

What is URL-safe Base64?

Standard Base64 uses + and /, which have special meanings in URLs. The URL-safe variant replaces them with - and _ so the string can travel inside query parameters and paths. Toggle the url-safe switch before encoding, and the decoder accepts both variants automatically.

How much larger is Base64 than the original data?

Base64 maps every 3 bytes onto 4 characters, so the encoded output is about 4/3 (≈133%) of the input size, plus up to 2 padding characters. The output pane shows the exact growth factor for every conversion.

Is my data uploaded anywhere?

No. Encoding, decoding, image conversion and Canvas processing all run locally in your browser with client-side JavaScript. Nothing is transmitted, logged or stored — safe for tokens, logs, and customer data.

Latest Articles