Base64 String & Text Encoder / Decoder (UTF-8 & URL-Safe)

The Mathematics of Base64 Encoding: RFC 4648 Standards

Base64 is a binary-to-text encoding scheme that translates arbitrary binary sequences into radix-64 representations using 64 printable ASCII characters. Formalized under IETF RFC 4648, Base64 ensures that binary payloads (images, cryptographic keys, compressed blocks) transit legacy 7-bit transmission channels—such as email (MIME), HTTP headers, and URL query strings—without corruption by control character transformations.

Bitwise 6-Bit Grouping and Padding Rules

The encoding algorithm divides input streams into sequential blocks of 24 bits (3 octets):

Stage	Binary Bit Grouping	Value Decomposition	ASCII Output Representation
Source Octets	3 bytes (24 bits)	01001101 01100001 01101110	"Man"
6-Bit Slices	4 groups × 6 bits	010011 \| 010110 \| 000101 \| 101110	Index: 19, 22, 5, 46
Base64 Encoded	4 ASCII characters	T \| W \| F \| u	"TWFu"

Overcoming the Legacy window.btoa() Unicode Defect

The native browser window.btoa() function was originally specified in HTML5 to treat strings as binary sequences of Latin-1 code points (where each character corresponds to an 8-bit byte). When an application feeds a string containing characters outside U+0000 to U+00FF (e.g. café, ñ, or 🚀) into btoa(), the browser immediately throws:

Uncaught DOMException: Failed to execute 'btoa' on 'Window': The string to be encoded contains characters outside of the Latin1 range.

To eliminate this defect, this tool utilizes the modern W3C Encoding API:

UTF-8 Encoding: new TextEncoder().encode(str) converts Unicode strings into standard Uint8Array UTF-8 byte buffers.
Binary String Mapping: The byte array is mapped via String.fromCharCode.apply before calling btoa(), preserving full Unicode character code fidelity.
Decoding: Base64 bytes are decoded back into a typed array and passed to new TextDecoder().decode() to reconstruct native UTF-8 graphemes.

URL-Safe Base64 (base64url) in Modern Web Standards

In modern web specifications—such as WebAuthn (FIDO2 authentication tokens) and JWTs (RFC 7519)—standard Base64 characters + and / pose routing conflicts in URL paths and HTTP query strings. URL-safe Base64 substitutes + with - and / with _ while stripping trailing padding characters (=), allowing seamless transmission inside HTTP Authorization headers without URL encoding.

Frequently Asked Questions (US Standards)

Why does the standard JavaScript btoa() function fail on Unicode strings and emojis?

The legacy window.btoa() browser method only accepts binary strings where each character code is within the 8-bit Latin-1 range (U+0000 to U+00FF). Multi-byte UTF-8 sequences (including accented characters, Asian ideograms, and emojis) throw a DOMException. This tool uses native TextEncoder and TextDecoder APIs to safely convert arbitrary UTF-8 byte streams into valid Base64.

What is the difference between standard Base64 and URL-Safe Base64?

Standard RFC 4648 Base64 utilizes the plus (+) and slash (/) characters, which have reserved semantic meanings in URLs and file systems (e.g., query separators and path delimiters). URL-Safe Base64 replaces "+" with "-" (hyphen) and "/" with "_" (underscore), and typically omits trailing "=" padding.

How much size overhead does Base64 encoding add?

Base64 maps every 3 binary octets (24 bits) into 4 printable ASCII characters (4 × 6 bits = 24 bits). This represents a constant mathematical size expansion of exactly 33.33% (ratio of 4 to 3), plus up to 2 padding characters.

Is my text or authentication token uploaded to any server?

No. All encoding and decoding operations execute 100% locally in your web browser memory using native Web APIs. No strings or keys are ever logged or transmitted.