What Is URL Encoding?
URLs can only carry a limited set of characters safely. URL encoding — also called percent-encoding — converts everything else into a safe format. Here is how it works and when you need it.
Why URLs need encoding
A URL is transmitted as plain text over the internet. Characters like spaces, ampersands, question marks and equals signs all have specific structural meanings in a URL: ? starts a query string, & separates parameters, = separates keys from values.
If you want to include a literal & as part of a value (not as a separator), you must encode it. Same for spaces, which are not valid URL characters at all. URL encoding provides a universal, unambiguous way to represent any character safely.
How percent-encoding works
Each unsafe character is replaced by a % sign followed by the two-digit hexadecimal representation of the character's byte value in UTF-8:
Space (0x20) → %20
é (UTF-8: 0xC3 0xA9) → %C3%A9
🌍 (UTF-8: 0xF0 0x9F 0x8C 0x8D) → %F0%9F%8C%8D
Common percent-encoded characters
| Character | Encoded | Character | Encoded |
|---|---|---|---|
| Space | %20 | ! | %21 |
| " | %22 | # | %23 |
| $ | %24 | % | %25 |
| & | %26 | ' | %27 |
| ( | %28 | ) | %29 |
| + | %2B | , | %2C |
| / | %2F | : | %3A |
| ; | %3B | = | %3D |
| ? | %3F | @ | %40 |
| [ | %5B | ] | %5D |
encodeURI vs encodeURIComponent
JavaScript provides two encoding functions with different scopes:
// encodeURI — encodes a full URL, preserves structural characters
encodeURI('https://example.com/path?q=hello world&lang=en')
// → 'https://example.com/path?q=hello%20world&lang=en'
// Note: & and = are NOT encoded (they are structural)
// encodeURIComponent — encodes a value, encodes everything
encodeURIComponent('hello world & more')
// → 'hello%20world%20%26%20more'
// Note: & IS encoded (it would break query string parsing if left raw)Try URL encoding and decoding
Encode any text or decode a percent-encoded string. Free, instant, no sign-up.
Open URL Encoder / Decoder →Frequently asked questions
What is URL encoding?
URL encoding (also called percent-encoding) converts characters that are not allowed or have special meaning in a URL into a safe format. Each unsafe character is replaced by a % followed by two hexadecimal digits representing the character's byte value in UTF-8. A space becomes %20, an ampersand becomes %26, and a slash becomes %2F.
Why is URL encoding necessary?
URLs can only contain a specific set of ASCII characters. Characters like spaces, quotes, angle brackets, and non-Latin letters are not allowed in URLs as-is because they have special meaning in HTML, HTTP or URL syntax, or they are not printable ASCII. URL encoding provides a safe way to include any character by representing it as % plus hex bytes.
Which characters are safe in URLs without encoding?
Unreserved characters do not need encoding: uppercase and lowercase letters (A-Z, a-z), digits (0-9), hyphen (-), underscore (_), period (.) and tilde (~). Reserved characters like /, ?, #, &, = and + have special structural meaning in URLs — they can appear unencoded in their structural positions but must be encoded when used as data values.
What is the difference between encodeURI and encodeURIComponent?
encodeURI encodes a complete URL — it leaves structural characters like :, /, ?, #, &, = and + unencoded because they are valid URL syntax. encodeURIComponent encodes a single value (like a query parameter) — it encodes everything including those structural characters. Use encodeURIComponent when encoding individual query string values; use encodeURI when encoding an entire URL.
How are non-ASCII characters URL encoded?
Non-ASCII characters like accented letters (é, ü), symbols, or emoji are first encoded as UTF-8 bytes, then each byte is percent-encoded. The letter é is represented as two UTF-8 bytes: 0xC3 and 0xA9 — so it becomes %C3%A9 in a URL. The globe emoji 🌍 becomes %F0%9F%8C%8D (four UTF-8 bytes).
What is the difference between URL encoding and HTML encoding?
URL encoding (percent-encoding) is for URLs — it uses % followed by hex bytes. HTML encoding (HTML entities) is for HTML content — it uses & followed by a name or number (e.g., & for &, < for <, > for >). They are different systems for different contexts. A URL inside an HTML href attribute might use both: the URL is percent-encoded, and the & between query parameters becomes & in HTML.