URL Encoder / Decoder
Understand URL Encoder / Decoder
Percent-encoding rewrites characters that carry structural meaning in a URL so they can be transmitted as data instead.
How it works
Each character outside the unreserved set (A–Z, a–z, 0–9 and - _ . ~) is replaced by a % followed by the two hex digits of every UTF-8 byte it takes, so a space becomes %20 and é becomes %C3%A9. The two modes are the two JavaScript functions, and the difference is what they leave alone: encodeURI preserves the characters that build a URL — : / ? # [ ] @ & = + $ , — while encodeURIComponent encodes those as well. Use encodeURI on a whole URL and encodeURIComponent on a single value you are about to drop into one.
When to use it
- Putting a user-supplied search term, email address, or filename into a query string.
- Building a redirect URL that carries another full URL as a parameter value.
- Reading a percent-encoded URL out of a server log or an OAuth callback to see what was actually sent.
- Encoding a path segment that contains spaces or non-ASCII characters.
Watch out for
- encodeURI is the wrong choice for a single value: it leaves & = ? # untouched, so a value containing & silently splits into two query parameters. That one difference causes most broken links.
- Form bodies and many older query strings encode a space as + rather than %20. Decoding here does not convert it back — decodeURIComponent leaves a literal plus sign.
- Encoding twice is a common bug and it is visible: %20 becomes %2520. Any %25 in a URL means something was encoded one time too many.
- encodeURIComponent leaves ! ' ( ) * unescaped even though RFC 3986 reserves them, so a few strict servers will still disagree with it.
Not the right tool for: Making a value safe to render in a page. A decoded URL parameter still needs HTML escaping before it reaches the DOM.
Frequently Asked Questions
What does URL encoding do?
URL encoding (percent-encoding) replaces special characters in URLs with a % followed by their hex ASCII code. Spaces become %20, & becomes %26. This ensures URLs are valid and parseable by all browsers and servers.
When should I URL encode a string?
Encode values before appending them to query strings, form POST bodies, or any URL component. Always encode user-supplied data — characters like &, =, #, ?, and + have reserved meanings in URLs.
What is the difference between encodeURI and encodeURIComponent?
encodeURI encodes a full URL, preserving structure characters (: / ? # [ ] @ etc.). encodeURIComponent encodes a single value and encodes those structure characters too — use it for query parameter values.
How to Use URL Encoder / Decoder
- Paste or type your input in the input area above.
- The tool processes your input automatically or click Run.
- Copy or download the result using the action buttons.
- Use Ctrl+Enter to run quickly from the keyboard.