base64.run

ASCII and Base64 are two different layers of the same problem: representing data as text. ASCII defines a fixed set of 128 characters and assigns each one a number (for example, A is 65). Base64 takes arbitrary binary data and rewrites it using only 64 of ASCII's printable characters, so the result can travel safely through systems that expect plain text. In short: ASCII is the character set, and Base64 is an encoding scheme that deliberately restricts its output to a safe subset of that set.

ASCII: a fixed mapping from characters to numbers

ASCII is a standard for representing 128 characters: uppercase and lowercase letters, digits, common punctuation, spaces, and some control instructions. Each supported character has a fixed numeric value, so any system that follows the standard can translate in both directions.

• A is always 65
• h is always 150 (as stated on base64.run)
• Control characters occupy the low range, such as NUL (0000), LF (0010), and CR (0013)

Because the mapping is fixed, text can be converted to numbers, processed by a computer, and shared between systems that all understand the same representation.

Base64: binary data expressed with printable ASCII

Base64 encoding is described on base64.run as "a convenient, portable way of representing data." It works by grouping input bytes and mapping them onto a 64-character alphabet. That alphabet is drawn from printable ASCII characters, which is why a Base64 string looks like ordinary text even when the original data was an image, a font, or a compiled file.

The practical consequence is portability. A channel that only reliably carries ASCII text — an email body, a config value, a URL component, a data URI — can still carry binary content once it has been Base64-encoded.

How the two fit together

Base64 does not replace ASCII; it depends on it. The encoding only works because both the sender and the receiver agree on what those 64 characters are and how they map back to bits.

Why this matters in practice

Safe transport through ASCII-only systems

If a system assumes text and may mangle non-printable bytes, Base64 sidesteps the problem by emitting only characters that survive that trip. The receiving side decodes the text back into the original bytes.

Embedding files directly in documents

base64.run notes that Base64-encoded copies of images, CSS, fonts, and JavaScript can be used where you would otherwise reference a URL. This uses the data URI format:

data:${mediatype};base64,${data}

Here ${mediatype} is a MIME type such as image/jpeg, image/png, image/gif, text/javascript, text/css, font/opentype;charset=utf-8, application/font-woff;charset=utf-8, or application/font-ttf;charset=utf-8. The ;base64, marker states how the data was encoded, and ${data} is the Base64-encoded file contents. This can remove dependencies on external files, reduce the number of network requests, or let a document exist on its own.

Debugging character problems

When decoding fails, the usual cause is that the input contains characters outside the Base64 alphabet — often because something already transformed the text. base64.run surfaces this directly with the message Not valid Base64 :(. Knowing that Base64 output should consist only of printable ASCII characters gives you a quick check: if you see unexpected symbols, whitespace, or line breaks, the string was probably altered in transit.

Trying it on base64.run

The site is built around a single input with Auto Detect, Encode Base64, and Decode Base64 actions. Its stated tips include:

• Drag and Drop — drag a file in to convert it quickly.
• Auto-detection — paste your input; if it already looks Base64-encoded it will be decoded, otherwise it will be encoded.
• URL shortcuts — you can link to the site with a specific input, such as https://base64.run/hello world or https://base64.run/aGVsbG8gd29ybGQ=. Encoded URI components will be decoded.

A simple way to see the ASCII/Base64 relationship for yourself: encode hello world and compare the result to the original. The input is plain ASCII text; the output is a longer string of printable ASCII characters that carries the same bytes in a different form.

Paste your text into the input box and base64.run will handle the rest: if the input already looks like Base64, it decodes it; otherwise it encodes it. You can also drag and drop a file onto the page, or put the content directly in the URL path (for example https://base64.run/hello world) to convert it. The tool shows "Not valid Base64 :(" when you try to decode something that isn't valid Base64.

Encoding or decoding pasted text

1. Open base64.run.
2. Paste your text into the input area.
3. Let auto-detection run. If the input looks like it's already Base64-encoded, the tool decodes it; if not, it encodes it.
4. Copy the result using the Copy control.

The key behavior here is auto-detection. You don't pick "encode" or "decode" first — the tool infers the direction from the input itself. That means the same paste action can produce opposite results depending on what you paste.

If you want to force a direction instead of relying on detection, the page exposes Encode Base64 and Decode Base64 controls alongside Auto Detect.

Converting a file by drag and drop

Drag a file onto the page to convert it quickly. This is the fastest path when your source isn't text you can copy — for example, an image, font, or stylesheet you want as a Base64 string.

The output is the Base64-encoded contents of that file, which is what you'd embed in a data URI.

Using URL shortcuts

You can link directly to a conversion by putting the content in the URL path:

• https://base64.run/hello world — encodes the text
• https://base64.run/aGVsbG8gd29ybGQ= — decodes the Base64

Encoded URI components in the URL are decoded first, so you can pass content that contains characters needing escaping.

This is useful when you want a reusable link that always performs the same conversion, rather than pasting each time.

What happens with invalid Base64

If you paste something that isn't valid Base64 and the tool tries to decode it, you'll see Not valid Base64 :(. Check for:

• Characters outside the Base64 alphabet
• Incorrect padding (Base64 uses = padding)
• Truncated or partially copied strings

If you only need to encode, this message won't appear — encoding accepts arbitrary text.

When to use Base64 at all

Base64 represents binary or text data as ASCII characters, so it can travel through systems that expect text. A common use is embedding assets directly in a document with a data URI:

data:${mediatype};base64,${data}

Here ${mediatype} is the MIME type (such as image/png, image/jpeg, text/css, or font/opentype;charset=utf-8), ;base64, marks the encoding, and ${data} is the Base64 content.

This helps when you want to remove dependencies on external files, cut the number of network requests, or make a document self-contained. The trade-off is that Base64 inflates size, so it isn't always the right choice for large assets.

Quick reference

Base64 is a way of representing arbitrary data as plain ASCII text, so it can travel safely through systems that only handle text. It is used most often in web development to embed images, CSS, fonts, and JavaScript directly into a document using the data: URI format, which removes dependencies on external files and can reduce the number of network requests. If you just need to convert something right now, base64.run encodes or decodes text and files in the browser, with auto-detection and drag-and-drop.

How Base64 encoding works

Base64 takes binary data and rewrites it using 64 printable characters — the uppercase and lowercase letters, the digits, and a couple of symbols — plus padding. The result contains only characters from the ASCII set, which is a standard for representing 128 characters (letters, numbers, punctuation, spaces, and some control instructions) as numbers. For example, A is always 65 and h is always 150. Because any system that follows ASCII agrees on those mappings, encoded data can be passed between systems without corruption.

The practical consequence: Base64 output is larger than the input (roughly a third bigger), but it is portable. You trade size for compatibility.

Why it is used

Embedding assets with data URIs

The main web use is the data URI format:

data:${mediatype};base64,${data}

• ${mediatype} is a MIME type describing the file, such as image/jpeg, image/png, image/gif, text/javascript, text/css, font/opentype;charset=utf-8, application/font-woff;charset=utf-8, or application/font-ttf;charset=utf-8.
• ;base64, marks how the data was encoded.
• ${data} is the Base64-encoded contents of the file.

Putting that string into an HTML or CSS file means the asset travels with the document. You can use it to remove dependencies on external files, cut the number of network requests, or let a document exist on its own.

Moving data between systems

Anywhere a channel expects text but you have binary or structured data, Base64 gives you a safe representation. The encoded form survives copy-paste, JSON fields, and text-only protocols that would otherwise mangle raw bytes.

Doing it on base64.run

The site is built around a single input with encode and decode modes, plus an auto-detect option.

• Auto-detection: paste your input. If it already looks Base64-encoded, it is decoded; otherwise it is encoded.
• Drag and drop: drag a file onto the page to convert it quickly.
• URL shortcuts: you can link directly to a conversion, for example https://base64.run/hello world or https://base64.run/aGVsbG8gd29ybGQ=. Encoded URI components are decoded.
• Validation: if the input is not valid Base64, the page reports it rather than returning a wrong result.

When to use it — and when not to

The trade-off is consistent: Base64 buys portability and fewer dependencies at the cost of a larger payload. For small, self-contained documents that is usually worth it; for large or widely reused assets it usually is not.

base64.run is a browser-based Base64 encoder and decoder. You paste text or drag in a file, and it converts the content in one direction or the other. It is useful when you need a quick one-off conversion without installing a command-line tool or writing code. The site also supports URL shortcuts, so a specific input can be encoded or decoded just by visiting a link.

What the tool does

The page presents a single working area with three modes: Auto Detect, Encode Base64, and Decode Base64. In Auto Detect mode, the tool inspects your input and decides what to do:

• If the input already looks like Base64, it is decoded.
• Otherwise, it is encoded.

If the input cannot be decoded as valid Base64, the page reports "Not valid Base64" rather than producing a broken result. A Copy control lets you take the output elsewhere.

Ways to get input in

Paste text

Paste into the input area. With Auto Detect active, you do not have to tell the tool which direction you want — it infers it from the content.

Drag and drop a file

Drag a file onto the page to convert it quickly. This is the practical route for binary content such as images, since Base64 is often used to embed files rather than plain text.

Use a URL shortcut

You can link directly to an encoded or decoded result. The documented pattern is:

https://base64.run/hello world
https://base64.run/aGVsbG8gd29ybGQ=

Visiting the first link encodes the text after the host; visiting the second decodes the Base64 string. The page notes that encoded URI components will be decoded, so percent-encoded characters in a shared link are handled before conversion.

What Base64 is actually for

Base64 represents data in a portable text form. The site highlights one main use case: web development. Base64-encoded copies of images, CSS, fonts, and JavaScript can be placed where you would otherwise reference a URL. That can:

• Remove dependencies on external files.
• Reduce the number of network requests.
• Let a document exist on its own.

This works through the data URI format:

data:${mediatype};base64,${data}

• ${mediatype} is a MIME type describing the file, such as image/jpeg, image/png, image/gif, text/javascript, text/css, font/opentype;charset=utf-8, application/font-woff;charset=utf-8, or application/font-ttf;charset=utf-8.
• ;base64, marks how the data was encoded.
• ${data} is the Base64-encoded file contents.

Why Base64 exists at all

The page explains the underlying reason with ASCII. ASCII is a standard for 128 characters — letters, numbers, punctuation, spaces, and some control instructions. Each supported character maps to a number, so systems that understand the standard can translate characters into numeric representations, process them, and share them. Base64 builds on this idea of a common, portable representation so data can move between systems that agree on the same encoding.

When to reach for it

Use base64.run when you want a fast, no-install conversion: decoding a token or payload you were handed, encoding a snippet for a data URI, or turning a small file into an embeddable string. For repeated or automated conversions inside a build pipeline, a library or command-line tool will fit better than a web page.

A Base64 data URI embeds a file's contents directly into a document instead of referencing it by URL. The format is data:${mediatype};base64,${data}, where ${mediatype} is the file's MIME type (such as image/png or text/css), ;base64 declares the encoding, and ${data} is the Base64-encoded file contents. You use it when you want a page or stylesheet to be self-contained or to avoid an extra network request for a small asset.

The data URI format, piece by piece

Put together, an embedded PNG looks like:

data:image/png;base64,iVBORw0KGgoAAAANSUhEUg...

The MIME type is not decorative — it tells the browser how to interpret the bytes. Common choices include image/jpeg, image/png, image/gif, text/javascript, text/css, font/opentype;charset=utf-8, application/font-woff;charset=utf-8, and application/font-ttf;charset=utf-8.

Where data URIs are useful

• Images, CSS, fonts, and JavaScript can be embedded wherever you would otherwise reference a URL.
• Removing dependencies on external files — the document no longer needs to fetch a separate asset.
• Reducing network requests — each embedded asset is one fewer round trip.
• Letting a document exist on its own — useful for single-file HTML, email templates, or offline artifacts.

How to build one

1. Get the Base64 text for your file. On base64.run you can drag and drop a file to convert it quickly, or paste content and let auto-detection decide whether to encode or decode. The site also accepts URL shortcuts: linking to https://base64.run/hello world encodes that input, and https://base64.run/aGVsbG8gd29ybGQ= decodes it. Encoded URI components are decoded automatically.
2. Identify the correct MIME type for the file you encoded.
3. Assemble the string as data:${mediatype};base64,${data}.
4. Paste it where the URL would go — for example, in an <img src="..."> attribute or a CSS url(...) value.

Verify it worked

Load the page and confirm the asset renders or executes. If it does not, check the three most common failure points:

• Wrong MIME type — a mismatched type can make the browser refuse to render the content.
• Truncated or corrupted Base64 — the payload must be the complete encoded file. base64.run reports "Not valid Base64 :(" when input cannot be decoded, which is a useful signal that the string is malformed.
• Missing ;base64 marker — without it, the browser will not treat the payload as Base64-encoded data.

When to embed and when to link

Embedding makes sense for small assets where the saved request outweighs the added document size. Because Base64 inflates the data, large files embedded this way bloat the document and can slow initial load. For big images, fonts, or scripts shared across many pages, a normal URL reference is usually the better choice.