URL Encode and Decode

What URL encoding does

A URL may only contain a small set of ASCII characters, and some of them have a job: ? starts the query string, & separates parameters, = splits a name from its value, # starts the fragment. Percent encoding, defined in RFC 3986, writes any other byte as a % followed by two hex digits. The text is first turned into UTF-8 bytes, so é becomes the two bytes %C3%A9 and € becomes three. RFC 3986 recommends uppercase hex digits, which is what this URL encoder writes; when you decode, case does not matter.

Component, full URL or form encoding

Which characters stay as they are depends on where the text goes, and text for an HTML page needs the HTML entity converter instead. The four modes match the rules you meet in practice:

• Component works like JavaScript's encodeURIComponent. It encodes everything except letters, digits and - _ . ! ~ * ' ( ), so &, =, / and ? inside a value can no longer break the URL. This is the right choice for one query parameter, a path segment or a whole URL that you pass as a parameter of another URL.
• Full URL works like encodeURI. It additionally leaves ; / ? : @ & = + $ , # alone, so a complete address keeps its structure and only spaces, quotes and non-ASCII characters change. The character lists of both functions are given in the MDN reference for encodeURIComponent and encodeURI.
• Form (+) follows the application/x-www-form-urlencoded format of the WHATWG URL Standard, which HTML forms and the browser's URLSearchParams use. A space becomes +, and only letters, digits and * - . _ stay unencoded.
• RFC 3986 is the strict version: only the unreserved characters, letters, digits and - . _ ~, stay. Unlike encodeURIComponent it also encodes ! ' ( ) *, which RFC 3986 reserves as delimiters. Use it when a signature or API spec asks for exact RFC 3986 encoding.

The plus sign and the space

In a query string, a + usually means a space, because the WHATWG form parser replaces every + with a space before it decodes the rest. In a path, + is just a plus sign. That is why a search for C++ has to send C%2B%2B, and why the decoder has a switch for it: tick "+ means space" for query strings and form data, leave it off for paths and plain text. The URL parts view always reads query values the form way, the same as URLSearchParams.

Double encoding and broken escapes

RFC 3986 states in section 2.4 that implementations must not percent-encode or decode the same string more than once. When it happens anyway, a space travels as %2520: the % of %20 was encoded again as %25. The decoder spots this and offers to remove all layers in one go. In Encode mode it warns you when your text already contains escapes, so you do not create the problem in the first place.

A % has to be followed by exactly two hex digits. A lone % sign, a cut off sequence or a typo like %2G makes JavaScript's decodeURIComponent throw a URIError, and so does a byte sequence that is not valid UTF-8. The WHATWG URL Standard is more forgiving: its percent-decoding keeps a stray % as it is, and its form parser, which URLSearchParams uses, turns bytes that are not UTF-8 into the replacement character �. This decoder is strict on purpose and tells you the exact position. A literal percent sign is written %25.

One source of invalid UTF-8 is text that was encoded with an older single-byte character set, where é is %E9 instead of %C3%A9. The decoder then also shows the text read as Windows-1252, which recovers the words when that was the character set used.

Reading a URL part by part

Switch to URL parts and paste a full address to see its scheme, host, port, path, query and fragment, parsed by your browser's own URL parser. Every query parameter gets its own row with the decoded name and value. Change a value, delete a tracking parameter or add a new one, and the rebuilt URL below updates at once, ready to copy. Edited rows are encoded like encodeURIComponent, so a space becomes %20 and a plus sign %2B; untouched rows keep exactly the form they had. For campaign links with utm parameters, the UTM builder creates them from scratch.

How to use the URL encoder and decoder

1. 1Choose Encode, Decode or URL parts.
2. 2Paste your text, query string or URL. The result updates as you type.
3. 3When encoding, pick Component for a single value, Full URL for a whole address, Form (+) for form data or RFC 3986 for strict APIs.
4. 4Copy the result, or press Use as input to run it the other way and check the round trip.

Frequently asked questions