URL Encoder / Decoder & Parser
Percent-encode or decode a value, a whole URL or form data, and see any URL split into its parts and query parameters.
URL parts
| Part | Value | Copy |
|---|
| Parameter | Value | Copy |
|---|
Your lid
Pin tools here. They are saved in this browser.
Pin a tool and its sticker lands here.
About this tool
What percent-encoding is
A URL may only contain a limited set of ASCII characters, and some of those have a job: ? starts the query, & separates parameters, # starts the fragment. Any other character, and any reserved character used as plain data, is written as a percent sign followed by two hexadecimal digits for each of its bytes. A space becomes %20, and é, which is two bytes in UTF-8, becomes %C3%A9. The rules are in RFC 3986.
Decoding reverses this. It fails when a percent sign is not followed by two hexadecimal digits, or when the escaped bytes are not valid UTF-8; the tool names the sequence and where it is.
Which mode to use
Component is right for a single piece of a URL: one query value, one path segment, a redirect URL passed as a parameter. It escapes /, ?, & and =, so the value cannot be mistaken for structure.
Whole URL is for a complete address that only needs its spaces and non-ASCII characters fixed. It leaves the structural characters alone, which also means it cannot protect a value that contains them. It escapes % as well, so running it on a URL that is already encoded encodes it twice, and it escapes the square brackets around an IPv6 address in the host. When decoding, this mode leaves the escapes of structural characters, such as %2F and %26, as they are.
Form is the application/x-www-form-urlencoded format that browsers use when they submit an HTML form, in the query string or in the request body, where a space is written as +. When decoding, a + is read as a space only in this mode.
How the URL is parsed
When the input, or else the output, is an absolute URL, the tool reads it with the browser's own URL parser, the same one that handles links and fetch. The table lists the scheme, credentials, host, port, path and fragment, and every query parameter with its key and value decoded. The parser normalises what it reads. In a web URL, for example, it lowercases the scheme and the host, resolves . and .. segments in the path and percent-encodes characters such as spaces, so the parts can differ slightly from what was typed. An internationalised host name in an http or https URL is shown in its ASCII (Punycode) form, as the parser stores it.
If the URL does not state a port and the tool knows the default for its scheme, it shows that default, for example 443 for https.
Questions
What is the difference between encodeURI and encodeURIComponent?
encodeURI is meant for a whole URL and leaves characters such as : / ? # & and = untouched. encodeURIComponent is meant for one value inside a URL and escapes those characters too. Use encodeURIComponent for query values, otherwise an & or = inside the value breaks the query string.
Should a space be encoded as %20 or as +?
%20 is valid everywhere in a URL. The + sign means a space only in application/x-www-form-urlencoded data, the format in which an HTML form sends its fields in the query string or the request body. In a path, + is a literal plus sign.
Why do I get an error when decoding a value that contains a percent sign?
A percent sign always starts an escape, so a literal one must be written as %25. Text such as "100% free" is not valid percent-encoded input because the percent sign is not followed by two hexadecimal digits.
Is the URL I paste sent to a server?
No. Encoding, decoding and parsing are done by JavaScript in your browser tab. The tool makes no network request with what you type.