What's the difference between encodeURI and encodeURIComponent?

encodeURI is for a complete URL and leaves characters like : / ? # & = alone. encodeURIComponent is for one piece of a URL, such as a query value, and encodes those characters too. Component mode here goes one step further and also encodes ! ' ( ) *, as RFC 3986 recommends.

Why do spaces sometimes become + instead of %20?

HTML forms use the application/x-www-form-urlencoded format, where + means a space in the query string. Use Form mode for that format and Component mode elsewhere.

Is my text sent anywhere?

No. Encoding and decoding happen in your browser.

Free developer tool

URL Encoder and Decoder

Percent-encode or decode URLs and query values, as a component, a full URL or form data, with UTF-8 support.

For a single query value or path segment. Encodes everything except letters, digits and - _ . ! ~ * ' ( ). Same as encodeURIComponent.

Text

Encoded

running%20shoes%20%26%20socks%20%2F%2050%25%20off%20%E2%80%94%20%C3%A7ok%20g%C3%BCzel

Encode and decode URLs correctly

URLs can only contain a limited set of characters. Everything else, including spaces, accented letters, emoji and symbols like & and =, has to be percent-encoded as UTF-8 bytes, such as %20 for a space or %C3%A7 for ç.

Pick the mode that matches what you're encoding. Component mode is for a single query value or path segment and encodes reserved characters. Full URL mode keeps the characters that give a URL its structure. Form mode matches what HTML forms send, with + for spaces.

Common mistakes

Encoding a whole URL in Component mode turns https:// into https%3A%2F%2F.
Encoding twice turns %20 into %2520. Decode first if you're not sure.
A literal % sign must itself be encoded as %25.

Frequently asked questions

What's the difference between encodeURI and encodeURIComponent?: encodeURI is for a complete URL and leaves characters like : / ? # & = alone. encodeURIComponent is for one piece of a URL, such as a query value, and encodes those characters too. Component mode here goes one step further and also encodes ! ' ( ) *, as RFC 3986 recommends.
Why do spaces sometimes become + instead of %20?: HTML forms use the application/x-www-form-urlencoded format, where + means a space in the query string. Use Form mode for that format and Component mode elsewhere.
Is my text sent anywhere?: No. Encoding and decoding happen in your browser.