Toolphy

URL Encoder & Decoder

Convert text and URLs to and from percent-encoding in your browser. Choose component or full-URL encoding and catch malformed sequences before they break a link.

Mode
0
Input characters
0
Output characters

How to Use the URL Encoder & Decoder

Percent-encoding keeps a URL valid by replacing characters that are not allowed in an address with a percent sign followed by two hexadecimal digits. This tool lets you encode and decode in one place. Follow these steps.

  1. Choose an encoding mode. Select Encode component to escape every reserved character, which is what you need for a single query-string value. Select Encode full URL to keep the structure of a complete address — its slashes, question mark, and colons — intact. Select Decode to turn percent-encoded text back into readable characters.

    Example: With Encode component, the phrase "search for cats & dogs" becomes "search%20for%20cats%20%26%20dogs". With Encode full URL, "https://toolphy.com/search?q=a b" becomes "https://toolphy.com/search?q=a%20b".

  2. Paste or type your input. Paste a URL, a query parameter, or any text into the input box. Text in any language works because the tool uses UTF-8 and encodes non-ASCII characters such as accented letters or emoji correctly.

  3. Decode form data when needed. Applications built on HTML forms send spaces as plus signs. If you are decoding a query string produced by a form, enable the "Treat + as a space" checkbox so those plus signs become spaces again before decoding.

  4. Click Encode or Decode and read the result. The output box fills instantly. If a percent-encoded string is malformed — for example it ends with a single "%" or contains "%G1" — the tool stops and shows a clear error instead of raising an exception or freezing the page.

  5. Copy the output. Use the Copy to Clipboard button to grab the converted value for your code, configuration file, or address bar. Nothing ever leaves your browser.

What Is URL Encoding?

URL encoding, also called percent-encoding, is the standard way to represent characters that are not permitted inside a Uniform Resource Locator. A URL may contain only a limited set of ASCII characters: letters, digits, and a few punctuation marks such as hyphen, underscore, period, and tilde. Everything else — spaces, accented letters, emoji, quotes, ampersands, and equals signs — must be escaped so that browsers, servers, and proxies agree on where one value ends and the next begins. Escaping works by writing a percent sign followed by the two hexadecimal digits of the character's UTF-8 byte. A space therefore becomes %20, an ampersand becomes %26, and the letter é becomes %C3%A9 because it occupies two bytes in UTF-8. JavaScript exposes two built-in functions for this job. encodeURIComponent escapes every character that has a reserved role, including the slash, question mark, ampersand, equals sign, plus sign, and hash. It is the correct choice when you are building the value of a single query parameter, because it guarantees that the value cannot be confused with the surrounding URL syntax. encodeURI is more permissive: it leaves intact the characters that give a URL its structure, so it can encode an entire address while preserving things such as "https://", "?" and "&". Decoding reverses the process with decodeURIComponent and decodeURI. Malformed percent-encoding is a real hazard. If a sequence contains a percent sign that is not followed by two hexadecimal digits, decodeURIComponent raises a URIError. A good tool catches that error and reports it plainly, because an unhandled exception would otherwise break the page or silently corrupt the value. This tool validates the input first and shows a localized message, so you always know whether a string is safe to decode. Everything runs locally in your browser, which means credentials, tokens, and private links contained in a query string never leave your device.

Common Applications

1. Building query strings: When you assemble an API call by hand, a search term such as "blue shoes & socks" must be encoded to "blue%20shoes%20%26%20socks" before it is appended after "?q=". Use Encode component for that value.

2. Reading analytics and logs: Marketing links and server logs are full of percent-encoded parameters. Pasting a campaign URL into the Decode mode reveals the readable UTM values and landing-page names hidden behind the escapes.

3. Debugging APIs: A request that returns 400 Bad Request is often caused by an unescaped space or ampersand in a parameter. Encoding the value correctly, or decoding what the server actually received, pinpoints the problem in seconds.

4. Working with form data: URL-encoded form submissions use plus signs for spaces. Decoding a login or search payload with the plus-as-space option reproduces exactly what the server parsed.

5. Preparing international content: Names, addresses, and messages in French, Spanish, Arabic, or Chinese contain characters outside ASCII. Encode them before sending them as a query parameter so the receiving server interprets every byte correctly.

6. Sharing links safely: When a URL contains another URL as a parameter, as in redirect or callback endpoints, the inner address must be fully encoded. The component mode does this without accidentally escaping the outer structure.

encodeURI vs encodeURIComponent

The two functions differ only in which characters they leave alone, but that difference matters. encodeURI preserves all reserved characters: ; , / ? : @ & = + $ #. It is designed to encode a whole URL and will not touch its syntax. encodeURIComponent escapes those same reserved characters, so the resulting string can be embedded safely as a single value. A common mistake is to run a full address through encodeURIComponent, which turns "https://" into "https%3A%2F%2F" and breaks the link. Use encodeURI for addresses and encodeURIComponent for parameter values.

Common Percent-Encoding Examples

A space is %20, a plus sign is %2B (remember that a literal plus in a query string often means a space instead), an ampersand is %26, an equals sign is %3D, a question mark is %3F, a slash is %2F, and a hash is %23. Non-ASCII letters are encoded byte by byte in UTF-8, so the euro sign becomes %E2%82%AC and a smiley emoji becomes %F0%9F%98%80. Recognising these patterns makes encoded strings far easier to read at a glance.

Guides

Frequently Asked Questions - FAQ

Is my data sent to a server?

No. Encoding and decoding happen entirely in your browser. Your input never leaves your device and is never uploaded.

What is the difference between the two encode modes?

Encode component (encodeURIComponent) escapes every reserved character and is ideal for a single query-string value. Encode full URL (encodeURI) leaves reserved characters such as "/", "?" and "&" untouched so an entire address stays valid.

Why does decoding sometimes fail?

decodeURIComponent throws an error when a percent sign is not followed by two valid hexadecimal digits, for example a lone "%" or "%G1". The tool catches this and shows a clear message instead of crashing.

Why do plus signs appear in encoded data?

HTML forms encode spaces as "+" characters. When you decode form-encoded data, enable the "Treat + as a space" checkbox so those plus signs are converted back to spaces before decoding.

Is there a size limit?

Very large strings are rejected to keep the page responsive. The tool refuses inputs above roughly one million characters and shows a warning instead of hanging.

Last updated: