What is URL Encoding?
URL encoding (also called percent-encoding) is the mechanism defined by RFC 3986 for carrying data inside URLs. Characters that have reserved meaning in a URL (such as ? / # & =) or that lie outside the ASCII printable range are rewritten as one or more %XX triplets, where XX is the byte's hexadecimal value. Decoders reverse the process byte by byte.
Percent-encoding is a transport format, not a security mechanism. Anyone who receives an encoded string can decode it trivially; do not confuse encoding with encryption or hashing.
How to choose a mode
This tool exposes the three encoding modes every developer eventually meets. The mode you pick determines which characters get encoded.
Component mode (encodeURIComponent). Use this when you encode a single value that will be embedded inside a URL — a query-string value, a path segment, a fragment. It encodes every URL-reserved character so the result is safe in any slot.
Whole URL mode (encodeURI). Use this when you already hold an assembled URL and only want to escape truly unsafe characters (spaces, non-ASCII). It leaves the structural characters : / ? # & = + intact so the URL remains parseable.
Form mode (application/x-www-form-urlencoded). Use this when you build an HTTP request body whose Content-Type is application/x-www-form-urlencoded. Space becomes +, newlines are normalized to CRLF (%0D%0A), and the character set mirrors what the browser sends when you submit an HTML form.
Reserved Characters Reference
| Char | Component | Whole URL | Form |
|---|---|---|---|
| (space) | %20 | %20 | + |
| ! | ! | ! | %21 |
| " | %22 | %22 | %22 |
| # | %23 | # | %23 |
| $ | %24 | $ | %24 |
| % | %25 | %25 | %25 |
| & | %26 | & | %26 |
| ' | ' | ' | %27 |
| ( | ( | ( | %28 |
| ) | ) | ) | %29 |
| * | * | * | * |
| + | %2B | + | %2B |
| , | %2C | , | %2C |
| / | %2F | / | %2F |
| : | %3A | : | %3A |
| ; | %3B | ; | %3B |
| = | %3D | = | %3D |
| ? | %3F | ? | %3F |
| @ | %40 | @ | %40 |
| [ | %5B | %5B | %5B |
| ] | %5D | %5D | %5D |
| ~ | ~ | ~ | %7E |
| %0A | %0A | %0D%0A | |
| 中 | %E4%B8%AD | %E4%B8%AD | %E4%B8%AD |
Component encodes everything except the unreserved set A–Z a–z 0–9 - _ . ! ~ * ' ( ). Whole URL additionally preserves the structural set ; , / ? : @ & = + $ # !. Form encodes the same set as Component plus ! ' ( ) ~ (but not *), turns space into + instead of %20, and normalizes \n / \r / \r\n to \r\n (encoded as %0D%0A) — matching what the browser sends for an application/x-www-form-urlencoded submission.
Common Use Cases
Building safe query strings programmatically: when you construct URLs like /search?q=[value] by hand, run the value through Component mode so that characters like & or = inside the value cannot corrupt the surrounding URL.
Embedding a URL inside another URL: when you pass one URL as the parameter of another (for example, an OAuth redirect URL), you must encode the inner URL with Component mode — not Whole URL — so that / : ? & inside the inner URL are not misread as the outer URL's structure.
Submitting form data with fetch: when you POST a body with Content-Type: application/x-www-form-urlencoded, the body must be encoded with Form mode semantics. This tool's Form mode produces output byte-compatible with what the browser sends.
Limitations
URL encoding is not encryption. Anyone can decode the output with a single function call; never use encoding to hide secrets.
Choice of mode matters. Running a whole URL through Component mode breaks the URL (every / becomes %2F). Running a query value through Whole URL mode can leave reserved characters dangerous (an & in the value still looks like a parameter separator). When in doubt, pick Component.