Base64 Encoder

Understanding Base64 Encoding

Base64 is one of those quiet workhorses of the internet that almost everyone relies on without noticing it. Every time you embed a small image inside a stylesheet or send binary through a text-only format, Base64 may be involved. This encoder turns UTF-8 text or exact file bytes into Base64 entirely within your browser. Use the separate decoder when you need the original text back, or Base64 to image for image data.

What Base64 Actually Is

At its heart, Base64 is a way of representing binary data using only 64 printable characters: the uppercase letters A to Z, the lowercase letters a to z, the digits 0 to 9, and two extra symbols, the plus sign and the forward slash. The name comes from the fact that the scheme draws from an alphabet of 64 symbols. The encoder takes the raw bytes of your data, groups them into chunks of three bytes (24 bits), and then splits each chunk into four groups of six bits. Because six bits can represent 64 possible values, each group maps neatly onto one character of the Base64 alphabet. When the input does not divide evenly into groups of three bytes, the encoder pads the result with one or two equals signs so the output length is always a multiple of four.

Why Base64 Exists

Computers store everything as binary, but many of the systems we use to move data around were originally designed only for text. Early email protocols, for instance, expected messages to contain printable characters and could mangle or strip out raw binary bytes such as the control characters that appear in an image or a compressed file. Base64 solves this by translating arbitrary binary into a safe, text-only form that survives transmission through channels that only understand text. The trade-off is size: because Base64 uses four characters to represent every three bytes, the encoded output is roughly 33 percent larger than the original. That overhead is the price you pay for guaranteed safe transport.

Where You See Base64 Every Day

Base64 turns up in more places than most people realise:

• Data URIs: small images, fonts, and icons can be embedded directly into HTML or CSS as data:image/png;base64,... strings, saving an extra network request.
• Email attachments: the MIME standard that powers modern email uses Base64 to encode attached files so they travel safely through mail servers.
• Embedding images and fonts: build tools often inline assets as Base64 to reduce the number of files a page must download.
• JSON Web Tokens (JWT): the header and payload of a JWT are Base64URL-encoded JSON objects, which is why you can decode the middle section of a token to read its claims.
• HTTP Basic authentication: the classic Authorization: Basic header carries a username and password joined by a colon and encoded with Base64.
• Storing binary in text formats: configuration files, XML, and APIs frequently carry certificates, keys, or small blobs as Base64 because those formats are text-based.

How to Use This Tool, Step by Step

Using the converter above takes only a moment:

• Enter text or choose a file. Text is encoded as UTF-8; a file is encoded from its exact bytes.
• Choose the output. URL-safe output replaces + and /; padding can be removed where the receiving format permits it.
• Create a data URI when needed. The prefix includes the selected file's MIME type, or text/plain;charset=utf-8 for text.
• Encode and export. Copy the result or download it as a text file.

Standard Base64 Versus URL-Safe Base64

Standard Base64 uses the plus sign and the forward slash as its two extra characters. Both have special meanings inside URLs, so URL-safe Base64 replaces them with a hyphen and an underscore. URL-safe Base64 is what JSON Web Tokens use. Choose it only when the receiving format expects that variant.

Important: Base64 Is Encoding, Not Encryption

This point deserves emphasis because it is the most common misunderstanding about Base64. Encoding a value does not protect it. Base64 is a reversible, public transformation with no secret key involved, so anyone who sees the string can decode it in seconds. Never treat Base64 as a way to hide passwords, API keys, personal information, or other sensitive data. Base64 makes binary data safe to transport as text; security is a separate concern.

The Size Overhead

Because every three bytes of input become four characters of output, Base64 increases the size of your data by approximately one third, or about 33 percent. For a tiny icon this is negligible, but for larger files the growth becomes meaningful, which is why you generally inline only small assets as data URIs and serve larger files normally. The padding characters add a tiny amount more. If you are deciding whether to embed something as Base64, weigh the saved network request against this extra weight.

Privacy and In-Browser Processing

Encoding happens locally in JavaScript. Text and file bytes are not uploaded to a QuickMerge processing server. Closing or refreshing the page clears the selected input and result. Text is converted to UTF-8 bytes first, so accented letters, emoji and other writing systems are encoded consistently.

Next steps