Live URL-encode and decode text, parse URLs and look up special characters.
| Protocol | {{ parsedUrl.protocol }} |
| Host | {{ parsedUrl.host }} |
| Port | {{ parsedUrl.port }} |
| Path | {{ parsedUrl.pathname }} |
| Hash / Fragment | {{ parsedUrl.hash }} |
| Parameter | Value |
|---|---|
{{ p.key }} |
{{ p.value }} |
| Character | Encoded | Category | Description |
|---|---|---|---|
{{ r.char }} |
{{ r.encoded }} |
{{ r.category }} | {{ r.desc }} |
URL encoding (also called percent encoding) converts special characters into a format that can be safely transmitted in URLs. Each disallowed character is replaced by a percent sign (%) followed by two hexadecimal digits, e.g., a space becomes %20. This is defined in RFC 3986 and ensures that URLs can be universally interpreted.
URL encoding is necessary whenever special characters, spaces, or non-ASCII characters appear in a URL parameter, path, or fragment. Browsers often encode URLs automatically, but when manually building API calls, redirect URLs, or tracking links, encoding must be done explicitly.
encodeURIComponent() for individual parameter values, encodeURI() for full URLs.%2520 instead of %20) are a common mistake — encode only once.Percent encoding — also called URL encoding — is standardized in RFC 3986 (Uniform Resource Identifier, 2005). It replaces unsafe or reserved characters with a percent sign followed by the two-digit hexadecimal byte value. A space (byte 0x20) becomes %20, the German u-umlaut (UTF-8: 0xC3 0xBC) becomes %C3%BC. The rule distinguishes unreserved characters (A-Z, a-z, 0-9, plus - . _ ~) which stay verbatim, and reserved characters (: / ? # [ ] @ ! $ & ' ( ) * + , ; =) which need encoding depending on their position.
Confusingly, JavaScript provides two encoding functions: encodeURI() preserves URL structural characters like / ? & # because they serve as separators; encodeURIComponent() encodes everything except unreserved characters. Rule of thumb: encoding a full URL? Use encodeURI. Encoding a single query parameter (e.g. the value after ?q=)? Use encodeURIComponent. The wrong choice produces classic bugs: ?redirect=https://example.com without encoding gets split, and the second URL path breaks the first.
A particular pitfall is the plus sign +. In URL paths it represents itself, but in query strings it traditionally means a space (legacy from the old application/x-www-form-urlencoded format, RFC 1866). That's why a plus inside a query value is often encoded as %2B. Servers that parse query strings strictly per RFC 3986 interpret + as a space, and HTML-form parsers do the same. This is also why plus-aliased email addresses ([email protected]) cause URL trouble with some providers. Another common source of confusion is the hash (#): it marks the fragment identifier, processed only on the client and never sent to the server. Anyone analyzing URLs in server logs will never see the hash portion — that's a security feature, not a bug. Single-page apps used to rely on this (/#/route); today hash routing is replaced by the HTML5 History API.
How to avoid the most common URL-encoding mistakes:
hash & salt.hash%20%26%20salt. Space becomes %20, ampersand becomes %26.?q=hash%20%26%20salt — works directly in the browser address bar.Typical characters and their percent-encoded equivalents:
" " → %20 — the most common case.+ → %2B (mandatory in query values, otherwise interpreted as a space).u (u-umlaut) → %C3%BC — two bytes per character.(grinning face) U+1F600 → %F0%9F%98%80 — four bytes in UTF-8./ → %2F (only when not used as path separator).URL encoding is not encryption, not tamper-protection and not XSS sanitization. A percent-encoded string carries the same information as the plaintext, just in URL-safe form. Anyone putting passwords or tokens in URLs should also think about HTTPS, since encoded values still appear in clear in server logs, browser history and Referer headers. Double-encoding is another common bug: encoding an already-encoded string turns %20 into %2520, and the recipient sees %20 instead of a space. There is no RFC-defined maximum URL length; in practice Chrome (32k), Edge (2k hard cut-off) and IE 11 (2083) enforce limits beyond which requests fail. Never encode body data into URLs — use POST. Another edge case: web servers like Apache and Nginx normalize URLs differently. Apache by default may collapse // to /, Nginx does not — which can produce surprising 404s with static file routes. When in doubt, consult the server docs before designing URL structures.
encodeURI preserves URL structural characters like / ? & # — for complete URLs. encodeURIComponent encodes everything except A-Z a-z 0-9 - _ . ~ — for individual query parameter values.+ (RFC 1866, application/x-www-form-urlencoded), not as %20. Most servers parse both variants, some only one.a (a-umlaut) becomes %C3%A4 — two bytes. Asian characters often need three bytes.%25 sequences.