URL Encoder / Decoder

Percent-encode a value for a query string, encode a whole URL without breaking its structure, or decode an encoded URL back to readable text — with a breakdown of host, path and query parameters. Runs entirely in your browser; nothing is uploaded.

How this tool works

The two encode modes use the browser's own encodeURIComponent and encodeURI, so the output is exactly what JavaScript would produce. Decoding checks every percent-escape first and points at the offending one when it's malformed, rather than returning the bare “URI malformed” the browser gives you. When the input is a complete URL with a scheme and host, the breakdown card splits it into protocol, host, port, path and fragment, and lists each query parameter with its decoded value.

Everything runs in your browser — nothing you paste is sent to a server, so it's safe to use on links that contain tokens or session IDs.

Frequently asked questions

What's the difference between "Encode component" and "Encode URL"?

Encode component (encodeURIComponent) escapes everything that has a meaning inside a URL — including / ? & = # and + — so a value survives intact when you drop it into a query string. Encode URL (encodeURI) leaves those structural characters alone and only escapes characters that can't appear in a URL at all, such as spaces and non-ASCII letters. Use the first for individual values and the second when you have a complete URL that just needs its spaces and accents fixed.

Why does a space sometimes become %20 and sometimes +?

Percent-encoding proper uses %20. The + convention comes from HTML form submission (application/x-www-form-urlencoded), which is why you see it in query strings generated by forms and by many server frameworks. A + in a path is a literal plus sign, but in a query string it usually means a space. The decoder's "Treat + as space" switch covers both cases; turn it off when decoding a path or when a + is genuinely a plus.

Why do I get a "malformed percent-escape" error?

Every % in encoded text must be followed by exactly two hexadecimal digits. A bare % ("50% off"), a truncated escape at the end of a copied string (%E0%A4%A), or a % followed by non-hex characters all fail. If you want a literal percent sign it has to be written as %25. A second kind of error appears when the escapes are well-formed but the bytes aren't valid UTF-8 — usually a multi-byte character cut in half, or text encoded in an older charset such as Latin-1.

Should I encode the whole URL with encodeURIComponent?

No — that turns https://example.com/path into https%3A%2F%2Fexample.com%2Fpath, which no longer works as a link. Encode each value separately and assemble the URL around them. The one time you do want the whole thing component-encoded is when the URL itself is a value, for example a redirect target or a share link passed as ?url=…

What is double encoding and how do I spot it?

Double encoding is encoding text that was already encoded, so %20 becomes %2520 and %26 becomes %2526. It usually happens when two layers of code each escape the same value. The symptom is that decoding once still leaves percent signs in the output — run Decode a second time to see the real value, then fix the code so only one layer does the encoding.

Related tools

JSON FormatterUTM Link BuilderBase64 Encoder / DecoderURL Slug Generator

Command Palette

Search for a command to run...