URL Encoder and Decoder
This URL encoder and decoder percent-encodes and decodes text with live two-way editing, and splits a full URL into protocol, host, path, query parameters and fragment, entirely in your browser.
About URL Encoder and Decoder
Type in either box and the other follows: plain text on top, percent-encoded below, converted on every keystroke rather than behind a button. When the top box holds a complete http or https URL, a further panel breaks it into protocol, host, path, fragment and a list of query parameters with their decoded values. That is usually what you actually need when a callback URL, a signed link or an OAuth redirect misbehaves - to see which parameter is malformed, and how many times it has been encoded.
RFC 3986 divides URI characters into unreserved ones that may appear literally and reserved ones that carry structural meaning, such as ? & = # / and :. Percent-encoding is how a reserved character sits inside a component without being read as structure. Two failure modes dominate. The first is under-encoding: an ampersand left raw inside a parameter value silently splits it into two parameters. The second is double encoding, where %2F becomes %252F on a second pass and the far end receives a literal percent sign where a slash was intended.
Encoding uses encodeURIComponent, which is the correct function for a single value you are placing inside a URL: it escapes the reserved characters, including / ? & = and #. encodeURI leaves those intact by design, because it is meant for a whole URL you do not want to break, which makes it the wrong choice for a parameter value. Decoding uses decodeURIComponent and reports a plain error when a percent sign is not followed by two hexadecimal digits. Parsing uses the browser's own URL and URLSearchParams, so the split matches what a browser will do.
How to use it
- 1Paste plain text or a full URL into the top box to see it percent-encoded below.
- 2Or paste an encoded string into the lower box to decode it upward; the two panes stay in sync whichever one you edit.
- 3If the top box holds an http or https URL, read the URL components panel for protocol, host, path and fragment.
- 4Scan the query parameters list, where each name appears with its decoded value, to spot a parameter encoded twice or not at all.
- 5If decoding fails, the tool reports that the string is not valid percent-encoding, which usually means a stray % or a truncated escape.
Common use cases
- -Troubleshooting an OAuth redirect_uri that the provider rejects because a parameter was encoded twice.
- -Decoding a long tracking or callback URL to see which parameters it actually carries before following it.
- -Building a query string by hand for a curl call and getting the escaping right the first time.
- -Confirming that a value containing an ampersand or a slash survives a round trip through your application.
- -Inspecting a signed URL whose signature covers the encoded form, to find where the two sides diverged.
Frequently asked questions
- What is the difference between encodeURIComponent and encodeURI?
- encodeURIComponent escapes every reserved character, including / ? & = # and :, so it is the correct function for a single value you are inserting into a URL. encodeURI leaves those characters alone because it is intended for a complete URI you do not want to break. Using encodeURI on a parameter value is a common bug: an embedded ampersand or slash passes through and corrupts the structure.
- What characters need to be percent-encoded in a URL?
- Under RFC 3986 the unreserved set - letters, digits, hyphen, full stop, underscore and tilde - may always appear literally. Everything else inside a component should be percent-encoded, in particular the reserved delimiters ? & = # / : @ [ ] and the space, which becomes %20. Non-ASCII text is encoded as its UTF-8 bytes, so one accented character becomes two escapes.
- Why is my URL showing %2520 instead of a space?
- Because it was encoded twice. A space becomes %20, and encoding that string again escapes the percent sign itself, giving %2520. The usual cause is an already-escaped value passed through an encoding function a second time, often across a framework or proxy boundary. Decode it here repeatedly until the output stops changing, which tells you how many passes were applied.
- Does a plus sign mean a space in a URL?
- Only in form-encoded data: the application/x-www-form-urlencoded serialisation used for query strings and HTML form bodies, where a space is written as +. In a path segment a plus sign is a literal plus, and RFC 3986 gives it no special meaning. Because the two conventions coexist, the safe practice is to encode spaces as %20 everywhere.