How to URL-encode or decode text
- 1.
Choose the mode
“Encode component” for a single parameter value, “Encode full URL” for an entire address, or “Decode” to turn %XX back into characters.
- 2.
Paste the text
The result appears instantly. Optionally treat spaces as “+”, as HTML forms do.
- 3.
Parse a URL
Paste a full address into the URL parser to see the protocol, host, port, path, fragment and every query parameter decoded.
How percent-encoding works
A URL may only contain a limited set of ASCII characters (RFC 3986). Every other character is converted to UTF-8 bytes, and each byte is written as % followed by two hexadecimal digits. Accented letters take 2 bytes, the euro sign 3 and emoji 4:
| Character | Encoded |
|---|---|
| space | %20 (or + in forms) |
| é | %C3%A9 |
| ü | %C3%BC |
| € | %E2%82%AC |
| 😀 | %F0%9F%98%80 |
| & | %26 |
| / | %2F |
| ? | %3F |
| # | %23 |
Example: the search phrase “winter boots & café” as a parameter value becomes winter%20boots%20%26%20caf%C3%A9.
encodeURIComponent vs encodeURI
- encodeURIComponent encodes everything except
A-Z a-z 0-9 - _ . ! ~ * ' ( ). Use it for single values - query parameters and path segments - so that an&inside a value does not split it into two parameters. - encodeURI additionally keeps the URL structure characters
; , / ? : @ & = + $ #. Use it to clean up a complete address that contains spaces or non-ASCII letters.
The classic bug is using encodeURI on a parameter value: ?q= + encodeURI("a&b") yields ?q=a&b - two parameters instead of one. In modern code, URLSearchParams and the URL class handle encoding for you.
Anatomy of a URL
https://user:pass@shop.example.com:8080/boots/winter?color=black&size=42#reviews
- protocol:
https: - credentials:
user:pass(deprecated, browsers warn about it) - host:
shop.example.com, port:8080(default 443 for https, 80 for http) - path:
/boots/winter - query string:
?color=black&size=42- key=value pairs separated by& - fragment:
#reviews- never sent to the server
Internationalised domain names such as bücher.de are stored in Punycode (xn--bcher-kva.de), and the parser shows that form.
Common mistakes
- Double encoding - encoding already encoded text turns
%into%25, so%C3%A9becomes%25C3%25A9. If you see%25in a link, decode it first. - Space as + or %20 - HTML forms (
application/x-www-form-urlencoded) use+, URL paths use%20. A plus in a path is a literal “+”. - Legacy encodings - old systems wrote “é” as
%E9(ISO-8859-1). That is not valid UTF-8, so the decoder reports an error instead of guessing. - Non-ASCII page addresses - for page URLs it is better to avoid accents altogether; create a clean, readable address with the slug generator.
Frequently asked questions
What does %20 mean in a URL?
+
How do I decode a link full of %C3 and similar codes?
+
Does + always mean a space?
+
Why do I get a “malformed percent sequence” error?
+
Should I use encodeURI or encodeURIComponent?
+
Are my URLs sent to a server?
+
Updated: