What is the difference between Component and Full URL modes?

Component mode uses encodeURIComponent, which encodes everything except letters, digits, and the characters - _ . ! ~ * ' ( ). Use it for individual query parameter names and values. Full URL mode uses encodeURI, which additionally preserves the reserved characters that give a URL its structure (: / ? # [ ] @ ! $ & ' ( ) * + , ; =). Use it when encoding a complete URL that you want to keep structurally valid.

What does "Treat + as space" mean?

In HTML form submissions (application/x-www-form-urlencoded), spaces are encoded as + instead of %20. When decoding query strings from form submissions, you should enable this toggle so that + is interpreted as a space. If your encoded text comes from a different source (e.g., a path segment or a JWT), leave the toggle off.

Why does my URL look the same after Full URL encoding?

If your URL only contains characters that are already valid in a URL (letters, digits, and reserved characters like : / ? = &), encodeURI leaves it unchanged. This is by design - encodeURI only encodes characters that would otherwise be invalid in a URL, not characters that have structural meaning.

Can I decode a full URL at once?

Yes - paste the entire URL into decode mode and it will be decoded in one step. If the URL contains multiple encoded parameters, they will all be decoded simultaneously. The output will be the fully decoded string.

URL Encoder / Decoder

What is URL encoding?

URL encoding (also called percent-encoding) is a mechanism for representing characters that are not permitted in a URL, or that have a special meaning within a URL, as a safe sequence of ASCII characters. Each unsafe character is replaced by a percent sign (%) followed by two hexadecimal digits representing the byte value of the character in UTF-8. For example, a space becomes %20, an ampersand becomes %26, and an emoji like 🌍 becomes %F0%9F%8C%8D.

Component vs Full URL encoding

Component encoding (encodeURIComponent)

encodeURIComponent is the most aggressive encoder. It encodes every character except letters (A–Z, a–z), digits (0–9), and a small set of unreserved punctuation (- _ . ! ~ * ' ( )). This includes the characters that give a URL its structure: :, /, ?, #, &, and =: all get encoded.

Use Component mode when encoding an individual query parameter name or value. For example, if the value is rock & roll, encoding it as a component gives rock%20%26%20roll, which is safe to embed in a URL as ?genre=rock%20%26%20roll.

Full URL encoding (encodeURI)

encodeURI is less aggressive. It preserves all characters that have structural meaning in a URL (; , / ? : @ & = + $ # in addition to unreserved chars), so the URL remains valid and navigable after encoding. Only characters that are genuinely invalid in a URL get percent-encoded.

Use Full URL mode when encoding a complete URL. For example, https://example.com/path to file?q=hello world becomes https://example.com/path%20to%20file?q=hello%20world: the protocol, slashes, and query separator are left intact.

Decoding percent-encoded strings

Switch to Decode mode to reverse percent-encoding. Paste any percent-encoded URL, query string, or path segment and the tool will decode all %XX sequences back to their original characters.

Enable the Treat + as space toggle when decoding form-encoded query strings (the application/x-www-form-urlencoded format used by HTML forms). In this format, spaces are encoded as + rather than %20. Most URLs from web applications use %20 for spaces, so leave the toggle off unless you know your input is form-encoded.

Common use cases

Building query strings: encode each parameter value with Component mode before assembling ?key=value&key2=value2.
Sharing URLs with spaces or special characters: encode the full URL so it can be safely pasted into a message, email, or document.
Debugging encoded URLs: paste an opaque encoded URL into Decode mode to read the original parameter values.
Form submissions: decode form data that uses + for spaces by enabling the Treat + as space toggle.
JWT and OAuth payloads: URL-encoded strings appear in many OAuth redirect URIs and token endpoints; decode them here to inspect the values.

RFC 3986 character categories

Category	Characters	Treatment in URLs
Unreserved (safe)	`A–Z a–z 0–9 - _ . ~`	Never percent-encoded
Reserved (structural)	`: / ? # [ ] @ ! $ & ' ( ) * + , ; =`	Encoded only when used as data, not as separators
Must encode	Spaces, <, >, {, }, \|, \, ^, `, and non-ASCII	Always percent-encoded

Form data encoding (‘+’ vs ‘%20’)

HTML form submissions using the application/x-www-form-urlencoded content type encode spaces as + rather than %20. This diverges from RFC 3986 and is a common source of bugs when developers mix the two encoding systems. When building query strings manually in JavaScript, encodeURIComponent produces %20 for spaces; when using URLSearchParams, spaces become +. Know which convention your server-side code expects.

Double-encoding pitfall

Encoding an already-encoded string turns %20 into %2520 (‘%’ itself is encoded as %25). This is a very common mistake when a URL passes through multiple encoding layers. Detect it by looking for %25 in the encoded output - if present, the input was already partially encoded. To avoid it, always decode fully first, then re-encode from the decoded form.