What is a Base64 data URL and how do I use it?

A data URL embeds file content directly in HTML or CSS using the format data:[mimetype];base64,[encoded-content]. For example, a PNG image can be embedded as without a separate HTTP request. The encoder outputs data URL format with the correct MIME type when you upload an image file.

Base64 Encoder / Decoder

Encode/decode text & files — URL-safe, MIME, data URLs

DeveloperFREEYour data never leaves your browser

100% freeNo signupRuns in your browser

By WOWHOW Team

Base64 Encoder / Decoder is a free, browser-based tool that lets you encode/decode text & files — url-safe, mime, data urls — with zero signup, zero installation. Your data never leaves your browser. Part of 116+ free developer and business tools at wowhow.cloud, built and maintained by a team with 14+ years of hands-on development experience.

TOOLBase64 Encoder / Decoder

URL-safe Base64Wrap at 76 chars (MIME)

Drop a file or click to upload — encode any file to Base64

Plain Text

0 chars · 0 bytes

Base64 Output

0 chars · 0 bytes

About Base64 Encoder / Decoder

Base64 encoding, defined in RFC 4648, converts arbitrary binary data to a printable ASCII character set using 64 characters: A-Z, a-z, 0-9, +, and /. It is the encoding used for email attachments (MIME), embedding images in HTML and CSS as data URLs, encoding binary data in JSON API payloads, and constructing JWT tokens. URL-safe Base64 (RFC 4648 Section 5) substitutes + with - and / with _ to eliminate characters that require percent-encoding in URLs and HTTP headers.

How It Works

Encoding splits the input binary data into 3-byte groups. Each group is treated as a 24-bit number and divided into four 6-bit segments. Each 6-bit value (0-63) is mapped to a Base64 character using the encoding table. If the input length is not divisible by 3, one or two = padding characters are appended to make the output length a multiple of 4.

Decoding reverses the process: each Base64 character is looked up in the encoding table to recover its 6-bit value, groups of four characters are combined into 24-bit numbers, and each 24-bit group is split into three bytes. Padding characters are stripped before conversion.

For text input, the string is first encoded to UTF-8 bytes using TextEncoder before Base64 encoding. The UTF-8 encoding ensures that non-ASCII characters (accented letters, CJK characters, emoji) are correctly represented in the binary stream before encoding begins. For file input, the FileReader API reads the file as an ArrayBuffer which is passed directly to the encoder.

Who Is This For

A developer embeds a small SVG icon as a Base64 data URL in a CSS background-image property to avoid an additional HTTP request for a tiny asset.

A backend engineer encodes a binary certificate file to Base64 to store it as a string in an environment variable for a cloud deployment.

A developer decodes a Base64-encoded image field from a third-party API response to verify the image content before passing it to an image processing function.

An engineer building a webhook handler decodes the Base64-encoded body of an incoming webhook to inspect the raw bytes before parsing the structured payload.

How to Use

Select Encode or Decode mode

Paste your text or drag and drop a file

See the result instantly in the output panel

Toggle URL-safe mode for use in URLs and filenames

Copy the output with one click

Frequently Asked Questions

Base64 converts binary data to ASCII text using 64 printable characters. Used in emails, data URLs, JWT tokens, and API payloads.

URL-safe Base64 replaces + with - and / with _ so the output can be safely used in URLs and filenames without percent-encoding.

Yes — drag and drop any file to encode it to Base64. Useful for embedding images in HTML/CSS as data URLs.

No server-side limit since everything runs in your browser. Large files (100MB+) may slow down your browser.

MIME (Multipurpose Internet Mail Extensions) Base64, defined in RFC 2045, wraps encoded output at 76 characters per line with CRLF line endings. This is required for email attachments and some older HTTP multipart forms. Toggle "MIME wrapping" in the tool to enable or disable it. URL-safe Base64 and standard Base64 for modern APIs should not use line wrapping.

A data URL embeds file content directly in HTML or CSS using the format data:[mimetype];base64,[encoded-content]. For example, a PNG image can be embedded as <img src="data:image/png;base64,iVBOR..."> without a separate HTTP request. The encoder outputs data URL format with the correct MIME type when you upload an image file.

Yes. Base64 encoding increases size by approximately 33% because every 3 bytes of input are represented as 4 ASCII characters. A 100KB image becomes approximately 133KB in Base64. For large assets, serving files as separate HTTP requests with proper caching is more efficient than embedding them as data URLs.