URL encode / decode
Round-trip URLs and query components without breaking on %20, +, #, &, or Unicode. Toggle between encodeURI (whole URL — leaves :/?#&= alone) and encodeURIComponent (every reserved char escaped — for values you stuff into a parameter). Under the result you get the list of characters that actually changed and what each one became, because when an encoding is wrong the useful question is which byte — not what the whole string now looks like. Double-encoded input is called out, and the round trip is verified.
How to use
- Paste your URL or the value you want to encode into the top box.
- Pick Mode — Encode turns characters into
%XX, Decode turns them back. The default auto-detects: if the input contains%XX, decode; otherwise encode. - Pick Component — Whole URL if you have a full URL and want to keep
:/?#&=intact; Component if you have a parameter value that may itself contain&or=. - Output appears live. Copy copies it; Swap moves the output into the input so you can chain encode → decode.
When to use which mode
- Whole URL + Encode: you have
https://example.com/file with spaces?q=hello worldand want a URL that browsers will accept.encodeURIescapes the spaces but leaves the structural:/?=&alone. - Component + Encode: you have one parameter value (say a JSON blob, a URL, or a string that contains
&). You need every reserved char escaped or it'll merge into the surrounding query string. - Whole URL + Decode: you have a URL where unsafe chars are percent-encoded and want to see what it really points to.
- Component + Decode: you have just the value of one query parameter and want it back to plain text.
FAQ
Why did my encoded output break the URL?
You probably wanted Component mode. encodeURI leaves & alone, which corrupts param boundaries when the value itself contains & or =. Switch to Component mode for parameter values.
What's the difference between + and %20?
Both encode a space — %20 is the RFC 3986 standard and works everywhere. + is a historical shortcut used only inside application/x-www-form-urlencoded bodies and query strings, and it's decoded back to a space only when the server treats the value as form data. Outside form data, + means a literal plus.
Does this work on Unicode?
Yes — both encodeURI and encodeURIComponent are UTF-8 aware. Pasting café in Encode mode produces caf%C3%A9.
Is anything sent to a server?
No. The encoding runs entirely in your browser — open the Network tab and confirm.