URL Encoder and Decoder
Percent-encode or decode text using JavaScript encodeURIComponent and decodeURIComponent. Everything runs locally in your browser.
URL encode and decode
What is URL encoding?
URL encoding (also called percent-encoding) represents characters in a URI using ASCII-only bytes. Bytes that are not allowed literally, or that you choose to encode, appear as a percent sign followed by two hexadecimal digits (for example, %3D for =).
URLs cannot safely contain raw spaces, line breaks, or many punctuation characters in every position, because those characters already mean something in the URL syntax (path separators, query delimiters, fragments, and so on). Encoding lets you put arbitrary text inside query parameters or path segments without breaking the structure of the URL.
This tool uses encodeURIComponent, which is appropriate for encoding a single component (such as one query value). It is stricter than encodeURI, which is meant for encoding an entire URI and leaves characters like ? and & unencoded.
Common encoded characters
| Character | Encoded (typical) | Notes |
|---|---|---|
| (space) | %20 | Often shown as + in HTML form submissions (application/x-www-form-urlencoded). |
| ! | %21 | encodeURIComponent keeps ! unencoded; other contexts may encode it. |
| # | %23 | Hash starts the fragment; must be encoded inside data. |
| $ | %24 | |
| & | %26 | Separates query parameters. |
| ' | %27 | encodeURIComponent leaves ' unencoded per RFC behavior in JS. |
| ( ) | %28 %29 | Parentheses are reserved in some URI rules. |
| + | %2B | A literal plus in form data may be read as space unless encoded. |
| / | %2F | Slash is a path delimiter; encode when it is data. |
| : | %3A | Used after scheme and in IPv6 literals. |
| = | %3D | Separates name and value in query strings. |
| ? | %3F | Starts the query string. |
| @ | %40 | Userinfo delimiter in authority. |
When to use URL encoding
- Query parameters — Values with spaces,
&,=, or Unicode should be encoded so the server parses the query correctly. - Form data — When building GET URLs or
application/x-www-form-urlencodedbodies, names and values are encoded so reserved characters do not break the format. - API calls — Clients often append search terms, tokens, or filters to REST or GraphQL HTTP URLs; encoding prevents injection of extra parameters and keeps special characters intact end-to-end.
FAQ
- What is the difference between encodeURIComponent and encodeURI?
- encodeURI is for whole URIs and preserves characters that structure URLs (
?,&,/, etc.). encodeURIComponent encodes those too, which is what you want for one parameter value or path segment. - Is URL encoding the same as HTML encoding?
- No. URL encoding uses percent escapes for bytes in a URI. HTML uses entities like
&for display inside markup. Use the right encoding for the layer you are working in. - Why do I see
%20instead of a space? - Spaces are not allowed raw in many URL parts.
%20is the percent-encoded form of the space byte. In some forms,+represents space instead; this tool decodes percent sequences with decodeURIComponent.