Skip to main content

← Back to blog

Base64 vs URL Encoding: What's the Difference?

Base64 and URL encoding are both “make this safe to transmit as text” tools, so they’re easy to mix up. But they solve different problems. Here’s the distinction.

Base64: binary → text

Base64 turns any binary data (an image, a file, raw bytes) into plain ASCII letters, digits, +, / and =. It grows the data by about 33%, and it is not encryption — anyone can decode it. Use it when a text-only channel needs to carry binary:

  • Embedding an image in HTML/CSS as a data: URI
  • Email attachments (MIME)
  • Putting small binary blobs into JSON or a token

More on that in Is Base64 encryption? (spoiler: no).

URL encoding: safe text in a URL

URL encoding (a.k.a. percent-encoding) replaces characters that have special meaning or aren’t allowed in a URL with %XX codes — a space becomes %20, & becomes %26, and so on. Use it when putting text into:

  • A query string (?q=hello%20world)
  • A path segment
  • Form submissions

See the URL encoding guide for details.

Key differences at a glance

  • Purpose: Base64 = carry binary as text · URL encoding = make text safe in a URL.
  • Output: Base64 = A–Z a–z 0–9 + / = · URL encoding = original text with %XX escapes.
  • Size: Base64 ≈ +33% · URL encoding grows only the escaped characters.

They often combine

A Base64 string can contain +, / and =, which are unsafe in URLs — so if you put Base64 into a URL, you either URL-encode it or use Base64URL (a URL-safe variant using - and _).

Try both, locally

Rule of thumb: Base64 to carry binary as text; URL encoding to put text safely in a link.

A worked example

Take the text a b&c. Each encoder treats it completely differently:

Input:          a b&c
URL-encoded:    a%20b%26c
Base64-encoded: YSBiJmM=

URL encoding leaves the letters alone and only escapes the space and the &, so the result is still readable. Base64 rewrites every byte into its own alphabet — four output characters for every three input bytes — so the output looks nothing like the input, but can now survive a channel that tolerates only a small set of safe characters. Different jobs, different output.

Common misuses

  • Using Base64 to “hide” data. It reverses in one step, so it protects nothing — treat it as an envelope, not a lock. See Is Base64 encryption?
  • URL-encoding a whole URL. Encode the parts — a query value, a path segment — not the entire address, or you turn https:// into https%3A%2F%2F and break the link.
  • Double-encoding. Encoding an already-encoded value gives %2520 (a % that was itself escaped). A space arriving as %2520 instead of %20 means something was encoded twice.
  • Forgetting Base64’s + and /. Plain Base64 is not URL-safe; inside a URL, use Base64URL or URL-encode the string.

Where each one shows up

  • Base64 appears wherever binary rides inside text: data: URIs, email MIME parts, the segments of a JWT, and binary fields stuffed into JSON.
  • URL encoding appears wherever text rides inside a URL: query strings, form posts (application/x-www-form-urlencoded), and path segments containing spaces or non-ASCII characters.

FAQ

Can I use Base64 instead of URL encoding?

No — they aren’t interchangeable. Base64 makes binary text-safe; URL encoding makes text URL-safe. Raw Base64 dropped into a URL can still break it because of +, / and =.

Why does my Base64 end with =?

That’s padding, added so the output length is a multiple of four. It’s normal, and some URL-safe variants omit it.

Does either one make data secure?

No. Encoding is about format, not secrecy — it’s fully reversible by anyone. For confidentiality you need encryption; for tamper-detection, a hash or signature.