Overview
What URL encoding is
Percent-encoding makes arbitrary text safe to place inside a URL.
URLs only allow a limited set of unreserved characters. Spaces, punctuation, and non-ASCII text must be rewritten so parsers can still find the path, query string, and fragment. The standard approach prefixes each unsafe byte with % and two hex digits — hence names like “percent-encoding” and “URL encoding.”
This tool offers two encode modes. Component mode escapes almost everything special, which is what you want for one query value or path segment. Full URL mode leaves structural characters alone so you can encode an entire address without breaking its shape.
Guide
How percent-encoding works
- 1
Identify unsafe characters
Letters A–Z, a–z, digits, and a small set of unreserved symbols (- . _ ~) usually stay as-is. Spaces, punctuation, and non-ASCII text need encoding.
- 2
Encode as UTF-8 bytes
Each character is converted to one or more UTF-8 bytes. ASCII characters are a single byte; many other characters need two or more.
- 3
Write %HH for each byte
Every byte becomes a percent sign plus two uppercase hex digits. For example space (0x20) becomes %20 and é (UTF-8 C3 A9) becomes %C3%A9.
- 4
Choose component vs full URL
If you are encoding one value, escape reserved delimiters too. If you are encoding a complete URL, keep :, /, ?, &, =, and # so the structure remains intact.
Example
Worked example
Encoding hello world? shows how the two modes diverge on reserved characters:
- Space → %20 in both modes
- ? stays in full-URL mode, becomes %3F in component mode
- Component: hello%20world%3F
- Full URL: hello%20world?
Reference
Characters you often encode
These reserved or awkward characters show up constantly in query strings and paths. Encoding them prevents the URL parser from treating them as syntax.
| Name | Char | Encoded | Why it matters |
|---|---|---|---|
| space | %20 | Very common in query values | |
| question mark | ? | %3F | Reserved as query delimiter |
| ampersand | & | %26 | Reserved as parameter separator |
| equals | = | %3D | Reserved in query pairs |
| slash | / | %2F | Reserved as path separator |
| hash | # | %23 | Reserved as fragment marker |
| percent | % | %25 | Must itself be escaped |
| plus* | + | %2B | *Often means space in form encoding |
Modes
Component vs full URL
Component mode
Matches encodeURIComponent. Escapes delimiters so a value cannot break out of its query parameter or path segment. Use this for user input you splice into a URL template.
Full URL mode
Matches encodeURI. Leaves structural characters alone while still encoding spaces and non-ASCII text. Use this when cleaning an entire address you already trust structurally.
Practice
When to URL-encode
Query parameters
Encode each value before joining with & and = so spaces and punctuation do not split the query string.
Search & redirects
Build search URLs or redirect targets from free-text input without breaking the destination address.
OAuth & webhooks
Many signed request flows require strictly percent-encoded parameter values for canonicalization.
Reading messy URLs
Decode a pasted link to see the real search terms, filenames, or Unicode text hidden behind % sequences.
Notes
Tips and common pitfalls
- Encode values, not entire already-built query strings, unless you intentionally want to escape the separators.
- Do not double-encode: encoding %20 again produces %2520 and breaks servers that decode only once.
- A literal + in a value should become %2B; do not assume + always means space outside form encoding.
- Decode failures usually mean a lone % without two hex digits, or a truncated multi-byte UTF-8 sequence.
FAQ
Frequently asked questions
- What is URL encoding?
- URL encoding (percent-encoding) replaces characters that are not safe in a URL with a % followed by two hexadecimal digits — the character’s UTF-8 byte value. A space becomes %20, for example. This keeps URLs valid and unambiguous across browsers and servers.
- What is the difference between the two modes?
- Component mode uses encodeURIComponent and escapes reserved characters like :, /, ?, and & — ideal for a single query parameter value. Full URL mode uses encodeURI, which preserves those structural characters so an entire URL stays functional.
- Is + the same as %20?
- In application/x-www-form-urlencoded bodies, + often represents a space. In general URI percent-encoding, a space should be %20 and a literal plus is %2B. This tool follows the encodeURIComponent / encodeURI rules, which emit %20 for spaces.
- Is my input sent to a server?
- No. Encoding and decoding use your browser’s native encodeURIComponent and decodeURIComponent functions, so everything stays on your device.
- Does it handle Unicode?
- Yes. Non-ASCII characters are encoded as UTF-8 bytes, then each byte is percent-encoded (for example é becomes %C3%A9).
- When should I decode?
- Decode when you need to read a pasted URL, debug a redirect, or recover the original parameter text. Leave values encoded when you are about to place them back into a URL.