URL Encoder / Decoder

URL encoding (percent-encoding) converts characters that aren't allowed or have special meaning in URLs into a safe format. A URL can only contain a limited ASCII character set. Characters like spaces, accented letters, or symbols (&, ?, =, #) must be encoded as a percent sign followed by two hex digits representing the character's byte value. For example, a space becomes %20, and & becomes %26. This ensures URLs are transmitted correctly across the internet.

encodeURI() encodes a complete URL — it leaves characters that have structural meaning in URLs (/, :, ?, #, &, =) unencoded. encodeURIComponent() encodes a URL segment (like a parameter value) — it encodes nearly everything including /, ?, &, and =. Use encodeURIComponent() when encoding individual query parameter values, and encodeURI() when encoding an entire URL. This tool uses encodeURIComponent() for the Encode mode.

Both represent spaces, but in different contexts. %20 is the standard percent-encoding for a space and works everywhere in a URL. The + sign represents a space only in query strings (the part after the ?), as per the application/x-www-form-urlencoded format used by HTML forms. In the path portion of a URL, + is a literal plus sign, not a space. When in doubt, use %20 — it is unambiguous and works universally.

In Python 3, use the urllib.parse module: from urllib.parse import quote, urlencode. To encode a string: quote('hello world') returns 'hello%20world'. To encode while preserving slashes: quote(string, safe='/'). To encode query parameters: urlencode({'q': 'hello world', 'page': 1}) returns 'q=hello+world&page=1'. For decoding: unquote('hello%20world') returns 'hello world'.

RFC 3986 defines unreserved characters that are safe in URLs without encoding: letters A-Z and a-z, digits 0-9, hyphen (-), underscore (_), period (.), and tilde (~). Reserved characters like /, ?, #, &, =, :, @, !, $, (, ), *, +, and ; have special meaning in URL structure and must be encoded if used as data values. Any character outside ASCII must be UTF-8 encoded first, then percent-encoded.

The modern way is new URLSearchParams(window.location.search). To get a specific parameter: params.get('q'). To iterate all parameters: for(const [key, val] of params). For a full URL: const url = new URL('https://example.com?q=test'); url.searchParams.get('q'). In older code you may see manual splitting on & and =, but URLSearchParams handles encoding/decoding automatically and is the recommended approach.

Non-ASCII characters must first be encoded as UTF-8 bytes, then each byte is percent-encoded. The Chinese character 你 (U+4F60) encodes to UTF-8 bytes E4 BD A0, resulting in %E4%BD%A0. Modern browsers and encodeURIComponent() handle this automatically. International domain names (IDN) use Punycode: 例え.jp becomes xn--r8jz45g.jp. This tool correctly handles Unicode characters in both encode and decode modes.

Use encodeURI() (not encodeURIComponent) to encode an entire URL. It leaves the structural characters — scheme (https://), path slashes, ?, &, and = — intact, while encoding any spaces or special characters within values. If you need to embed one URL as a parameter inside another URL, encode the inner URL with encodeURIComponent() so its ? and & characters don't interfere with the outer URL's structure.

Differences arise because there are multiple encoding standards. encodeURIComponent() follows RFC 3986 and does not encode unreserved characters. Older tools may encode more characters. The case of hex digits (uppercase %2F vs lowercase %2f) varies — both are valid. Using + vs %20 for spaces depends on the encoding standard (form encoding vs standard URI encoding). This tool uses JavaScript's encodeURIComponent() for maximum compatibility with modern APIs and browsers.

A query string is the part of a URL after the ? character, containing key=value pairs separated by &. UTM parameters are standardized query parameters used by Google Analytics to track marketing campaigns: utm_source (where traffic comes from), utm_medium (marketing channel), utm_campaign (campaign name), utm_content (specific ad), and utm_term (paid keyword). Use the Parse tab above to break down any URL containing UTM parameters into its individual tracking components.