Skip to content
DevTools

URL Encoder

text ⇄ %XX

Percent-encode a value or a whole URL, and break a link into its parts.

Escapes everything reserved, including : / ? # & =
plain
encoded
Result appears here

About URL Encoder

URLs may only contain a limited set of characters, so anything else — spaces, ampersands, accented letters, emoji — has to be percent-encoded as its byte values written in hex. This encodes and decodes in both directions as you type.

The distinction that matters is scope. Encoding one value escapes every reserved character, including the slashes, question marks, and ampersands that give a URL its structure; that is what you want for a single query parameter. Encoding a whole URL leaves those structural characters alone and only escapes the illegal ones. Choosing the wrong one is the usual reason a link works locally and breaks in production. On the decode side there is a separate mode for form-encoded data, where a plus sign means a space rather than a literal plus.

When what you have parses as a URL, it is also broken into scheme, host, port, path, fragment, and each query parameter decoded individually — which is often faster than reading a long query string by eye.

Common questions

What is the difference between encodeURIComponent and encodeURI?
encodeURIComponent escapes : / ? # [ ] @ & = + $ , as well as spaces, so it is correct for a single value being dropped into a URL. encodeURI leaves those structural characters intact, so it is correct for a complete URL that just contains illegal characters. Use the first for parameters, the second for whole links.
Why is a space sometimes %20 and sometimes +?
%20 is the correct percent-encoding of a space anywhere in a URL. The plus sign is a convention specific to application/x-www-form-urlencoded bodies and query strings produced by HTML forms. Decode form data with the wrong mode and every plus in the original text turns into a space.
Why do I sometimes see %2520?
Something was encoded twice. The % of %20 was itself escaped to %25, giving %2520. Decoding once yields %20 and decoding again yields the space — a reliable sign that two layers of code are both encoding the same value.
Should I encode the whole URL before making a request?
No. Encode each value as you build the URL, not the finished string. Encoding the whole thing escapes the separators your server relies on to split it apart, and double-encoding anything already escaped.

This page does the work itself, in this tab. Nothing you paste is sent to a server. Close the tab and no copy remains.