$ encode --url
url encoder / decoder.
Encode or decode URL strings instantly. 100% client-side, no data leaves your browser.
input
1
2
3
4
5
2
3
4
5
0 / ∞ chars
output
URL encoding converts special characters into a format that can be transmitted over the internet. Spaces become %20, reserved characters like & and = get encoded to %26 and %3D respectively.
Use encodeURI for a full URL (preserves scheme, host, path). Use encodeURIComponent for query parameter values — it encodes everything including / and ?.
That is JSON encoded into URL-safe format. This happens when objects are serialized into query strings without proper encoding.
Common URL Encoded Characters
| Character | Encoded | Name |
|---|---|---|
| %20 | Space |
! | %21 | Exclamation mark |
# | %23 | Number sign |
$ | %24 | Dollar sign |
& | %26 | Ampersand |
' | %27 | Single quote |
( | %28 | Left parenthesis |
) | %29 | Right parenthesis |
* | %2A | Asterisk |
+ | %2B | Plus sign |
/ | %2F | Slash |
: | %3A | Colon |
= | %3D | Equals sign |
? | %3F | Question mark |
@ | %40 | At sign |
encodeURI vs encodeURIComponent
JavaScript provides two encoding functions — using the wrong one is a common bug:
// encodeURI — for full URLs (preserves : / ? & = #)
encodeURI("https://example.com/path?q=hello&lang=en")
// → "https://example.com/path?q=hello&lang=en"
// encodeURIComponent — for individual values (encodes everything)
encodeURIComponent("hello world&foo=bar")
// → "hello%20world%26foo%3Dbar"Rule of thumb: Encoding a query parameter value? Always use encodeURIComponent. Building a full URL? Use encodeURI.
When You Need URL Encoding
URL encoding appears in more places than you might expect:
- Query strings —
?search=hello+world(space becomes+or%20) - Form submissions — POST bodies use URL encoding for
application/x-www-form-urlencoded - API calls — OAuth tokens, API keys in URLs must be encoded
- Cookies — Cookie values with special characters need encoding
- JavaScript —
fetch()requests with user input in URLs
learn more in our detailed guide.
→ read the guide