URL Encoder/Decoder
Encode or decode URL components using JavaScript's native `encodeURIComponent` and `decodeURIComponent`.
How It Works
The URL Encoder/Decoder applies the percent-encoding rules from RFC 3986 to convert any string into a form that is safe to use inside URLs, query strings, or application/x-www-form-urlencoded request bodies. The encoder uses JavaScript’s native encodeURIComponent, which percent-encodes every character that is not an unreserved ASCII letter, digit, hyphen, underscore, period, or tilde — including spaces (which become %20, not +), reserved characters such as &, ?, =, #, /, and the full Unicode range encoded as UTF-8 byte sequences. The decoder reverses the process with decodeURIComponent, restoring the original text. Input is processed instantly as you type and runs entirely in your browser — no network round-trip is involved, which keeps query parameters or OAuth callback values that may contain sensitive identifiers private. The tool deliberately uses the component variant rather than encodeURI: the latter preserves URL structural characters and is wrong for encoding values that go inside a query parameter. If you have a malformed input that breaks decoding (a stray % not followed by two hex digits), the error is shown inline so you can locate the issue in the source string.
Use Cases
- Building query strings for API requests
- Debugging percent-encoded URLs in browser network tabs
- Encoding user-supplied values before appending them to URLs
- Decoding redirect targets or OAuth callback parameters
Frequently Asked Questions
- What is the difference between encodeURI and encodeURIComponent?
- encodeURI preserves URL syntax characters like &, ?, =, /, and #, so it is for whole URLs. encodeURIComponent encodes them too, which is what you want when building a single query parameter value. This tool uses the component variant.
- Why does space become %20 and not +?
- Both are valid in different contexts: %20 is RFC 3986 standard for URLs and works everywhere; + is an older form-encoding shortcut. The tool uses %20 for safety.
- Can I encode an entire URL?
- Yes, but the slashes, query separator, and fragment marker will be encoded too. For round-tripping a full URL untouched, encode each query parameter value separately.
- Does this work with non-ASCII text?
- Yes. Non-ASCII characters are first encoded as UTF-8 bytes and each byte is then percent-encoded — the standard handling.
- Why am I getting a decode error?
- A stray % sign that is not followed by two hexadecimal digits will fail. Check for truncated or double-decoded input.