URL Encoder / Decoder

Encode a string for use inside a URL (or decode percent-escapes back to text). Shows component vs full-URI variants and base64url for token use.

Inputs

Any string. UTF-8 bytes are encoded; reserved characters get %XX percent-escapes.

Result

Loading calculator…

How to use this calculator

  • Pick a direction.
  • Encode mode: copy whichever variant you need (component / URI / form / base64url).
  • Decode mode: paste any percent-escaped or base64url string and read the original text.

About this calculator

URL percent-encoding is the convention every web framework uses to embed non-URL-safe characters inside a URL. Reserved characters like &, =, ?, /, and space get rewritten as %XX (the hex of the UTF-8 byte). For a path segment or query-string VALUE you almost always want encodeURIComponent — encodeURI is much more permissive and is meant for re-escaping an already-built URL. This tool runs both, plus the form-encoding variant (space→+) and base64url for JWT-style token use.

How it works — the formula

encodeURIComponent: char ∉ [A-Za-z0-9-_.~!*'()] → %XX of UTF-8 byte encodeURI: same, but also excludes reserved URI syntax: / ? # [ ] @ etc. base64url: base64 with +→- /→_ and trailing = stripped

Percent-encoding is byte-level: encode UTF-8 bytes one at a time. A multi-byte character produces multiple %XX sequences. Decoding reassembles the UTF-8 byte stream and re-decodes to a string.

Worked examples

Example 1
Encode "hello world"
Inputs:
mode=encode, text=hello world
Output:
hello%20world
Example 2
Encode "&=?"
Inputs:
mode=encode, text=&=?
Output:
%26%3D%3F (component) / &=? (URI)
Example 3
Decode "%E4%B8%AD"
Inputs:
mode=decode, text=%E4%B8%AD
Output:
中 (U+4E2D)

Limitations

  • encodeURI vs encodeURIComponent semantics follow WHATWG / RFC 3986 specs.
  • base64url decode is attempted only when input matches the alphabet.
  • No automatic URL parsing — for splitting a full URL into scheme/host/path/query use a URL parser.

Encodings round-trip exactly: decode(encode(x)) === x for any UTF-8 string.

Frequently asked

When should I use encodeURIComponent vs encodeURI?+
encodeURIComponent for any value going into a URL (query-string values, path segments, fragments). encodeURI only for an entire URL where you want to escape stray characters but keep the URL syntax (: / ? = & #) intact.
What is the difference between %20 and + in URLs?+
Both decode to space, but %20 is the universal percent-escape (works anywhere) and + is form-encoding (application/x-www-form-urlencoded). Browsers accept both interchangeably in query strings; servers may not.
What is base64url?+
A URL-safe variant of base64 used in JWT tokens, OAuth, and signed URLs. It replaces + and / with - and _, and drops the trailing = padding.
Why does the decoder fail on some inputs?+
The input contains an invalid %XX sequence — e.g. %ZZ or a trailing % with no hex digits. The tool reports the error rather than guessing.
Does this handle Unicode correctly?+
Yes. encodeURIComponent uses UTF-8 byte sequences; the decode side reassembles them. Emoji and CJK characters round-trip cleanly.

Related calculators

More tools you might like

Hand-picked tools that pair well with this one — same audience, same intent.