URL Encoder / Decoder

What Is URL Encoding?

URL encoding — formally known as percent-encoding — is the process of converting characters that are not allowed or have special meaning in a URL into a universally safe format. The encoded form uses a % sign followed by two hexadecimal digits representing the UTF-8 byte value of the character.

For example:

• Space → %20
• & → %26
• = → %3D
• Chinese character 中 → %E4%B8%AD
• © → %C2%A9

URL encoding is defined in RFC 3986 and is essential any time you need to pass data through a URL — such as search query terms, form submissions, API parameters, or redirect destinations.

encodeURIComponent vs encodeURI

JavaScript (and therefore browsers) provides two built-in encoding functions with different scopes:

encodeURIComponent

encodeURIComponent encodes everything except the unreserved characters: A–Z a–z 0–9 - _ . ! ~ * ' ( ). This makes it safe for encoding individual values that will appear within a URL — such as a query parameter value, a path segment, or a hash fragment — without accidentally encoding structural URL characters.

encodeURIComponent("hello world & goodbye")
// → "hello%20world%20%26%20goodbye"

Use encodeURIComponent when you are constructing a URL programmatically and encoding individual pieces.

encodeURI

encodeURI additionally preserves the characters that carry structural meaning in a URL: ; , / ? : @ & = + $ #. It is designed for encoding a complete URL when you want to keep the URL structure valid.

encodeURI("https://example.com/path?q=hello world")
// → "https://example.com/path?q=hello%20world"

Use encodeURI when you have a full URL and only want to make it safe to embed in HTML attributes or HTTP headers without breaking its structure.

How URL Decoding Works

Decoding reverses the encoding process: each %XX sequence is replaced by the byte it represents, and the resulting byte sequence is decoded as UTF-8. This tool uses decodeURIComponent for decoding, with a fallback to decodeURI for cases where structural characters were encoded with encodeURI.

If a percent-sequence is malformed (e.g. %GG or an incomplete %2), decoding will fail — the tool will display an error message rather than produce incorrect output.

URL Structure and Parsing

A URL is made up of several distinct components:

https://user:pass@example.com:8080/path/to/page?key=value&foo=bar#section
│       │          │           │    │             │                 │
protocol  userinfo   hostname  port  path          query            fragment

The URL Parser tab in this tool accepts any URL and displays each of these components separately, with query parameters broken out into individual key-value rows.

Common Use Cases

API development: When building REST API calls, use encodeURIComponent to safely encode query parameter values that may contain special characters like &, +, or Unicode text.

Form data handling: HTML forms submitted via GET append field values to the URL as query parameters. Browsers encode these automatically, but when constructing URLs in JavaScript you need to encode values explicitly.

Debugging: Copy a URL from a network request log or browser developer tools and paste it into the URL Parser to quickly understand its structure and inspect all query parameters.

Link construction: Encoding redirect URLs or callback parameters requires careful use of encodeURIComponent to avoid breaking the outer URL’s structure.

Internationalized URLs (IDN): URLs must be ASCII. Non-ASCII characters in paths and query strings must be percent-encoded as their UTF-8 byte sequences, which this tool handles correctly for all Unicode characters including Chinese, Japanese, Arabic, emoji, and more.

Frequently Asked Questions

What characters does URL encoding affect? Any character not in the unreserved set (letters, digits, -, _, ., ~) must be percent-encoded when used as data inside a URL component. Characters like ?, &, =, /, # have structural meaning and only need encoding when they appear as data (not as delimiters).

Why does a space become %20 and not +? Both conventions exist. %20 is the RFC 3986 standard for percent-encoding. The + sign for spaces is specific to the application/x-www-form-urlencoded content type (used in HTML form submissions). This tool uses the standard %20 encoding.

Can I decode a URL that was encoded with encodeURI? Yes. The Decode tab uses decodeURIComponent with a fallback to decodeURI, covering both encoding methods.

Does the URL Parser support non-HTTP schemes? Yes. The parser uses the browser’s native URL API which supports https:, http:, ftp:, file:, and other valid schemes. Bare hostnames without a scheme (like example.com/path) are treated as HTTPS.

Is this tool private? Yes. All encoding, decoding, and parsing happens entirely in your browser. No data is sent to any server.