URL Encoder and Decoder

URLs may only contain a limited set of characters. Everything else, such as spaces, accents, & and #, must be written as percent-encoding: a percent sign followed by the two hex digits of each UTF-8 byte. The right amount of encoding depends on where the text goes.

• Component (encodeURIComponent): encodes almost everything, including / ? # & =. Use it for a single value that you put into a path segment or query parameter.
• Whole URL (encodeURI): keeps the characters that structure a URL (: / ? # & =) and encodes the rest. Use it to clean up a complete address that contains spaces or accents.
• Form data: like component, but spaces become +, as in application/x-www-form-urlencoded bodies and many query strings.

When you decode a full URL with a query string, the tool also lists each parameter name with its decoded value, which makes long tracking and redirect links easy to read.

Encode the value café & crème as a component:

caf%C3%A9%20%26%20cr%C3%A8me

The letter é is two UTF-8 bytes (C3 A9), so it becomes %C3%A9. The ampersand became %26, which is vital: an unencoded & would be read as the start of the next parameter. In form mode the spaces would be + instead of %20.

• Double encoding: encoding text that is already encoded turns %20 into %2520. If you see that, decode once.
• Using the whole-URL mode on a value: a value containing & or = will not be escaped and will corrupt the query string.
• Plus versus %20: a plus means a space only in form-encoded data; in a path it is a literal plus.
• Malformed input: a lone % or a broken UTF-8 sequence cannot be decoded. The tool tells you instead of guessing.

Related: Base64 and HTML entities.