URL Encoding and Decoding: Complete Guide with Examples
The URL Encoder/Decoder converts characters that are not safe in URLs into their percent-encoded equivalents, and decodes them back. Whether you're building API requests, debugging query strings, or working with redirects, this tool handles both directions instantly in your browser.
Ready to encode or decode a URL? Open the tool and paste your string.
Open URL Encoder ↗What Is URL Encoding?
URLs can only contain a limited set of ASCII characters. Spaces, special characters like &, =, #, and non-ASCII characters like accented letters or emoji must be converted before they can appear in a URL. URL encoding (also called percent-encoding) replaces each unsafe character with a % followed by its two-digit hexadecimal code.
For example, a space becomes %20, the & ampersand becomes %26, and a forward slash becomes %2F. The browser or server on the receiving end decodes these sequences back into the original characters.
When to Encode vs Decode
Encode when:
- Building query string parameters that contain special characters — e.g. a search query with spaces or punctuation
- Passing a URL as a parameter inside another URL
- Sending form data via GET requests
- Constructing API endpoint URLs programmatically
Decode when:
- Reading a URL from a log file or database that contains percent-encoded sequences
- Debugging a redirect that looks garbled
- Extracting query parameter values from a URL string
How to Use the Tool
Type or paste the string you want to encode or decode into the input box. This can be a full URL, just a query string value, or any text string.
Select whether you want to encode (convert special characters to percent sequences) or decode (convert percent sequences back to readable characters). The tool processes your input instantly as you type.
Click the Copy button to copy the encoded or decoded string to your clipboard, ready to paste into your code, browser, or API client.
Common Encoding Examples
| Original | Encoded | Why |
|---|---|---|
| hello world | hello%20world | Spaces not allowed in URLs |
| name=John & age=30 | name%3DJohn%20%26%20age%3D30 | = and & are query delimiters |
| https://example.com | https%3A%2F%2Fexample.com | Encoding URL as a parameter value |
| café | caf%C3%A9 | Non-ASCII character |
encodeURI vs encodeURIComponent
If you use JavaScript, you've likely encountered both encodeURI() and encodeURIComponent(). They differ in what they leave alone:
- encodeURI() encodes a complete URL — it leaves characters like
:,/,?, and=intact because they're structural parts of a URL. - encodeURIComponent() encodes a value that goes inside a URL — it encodes those structural characters too, which is what you want for query parameter values.
Rule of thumb: Use encodeURIComponent() for query parameter values. Use encodeURI() only if you're encoding a complete URL that already has its structure intact.
// Encoding a query parameter value — use encodeURIComponent
const query = encodeURIComponent("hello world & more");
const url = `https://example.com/search?q=${query}`;
// → https://example.com/search?q=hello%20world%20%26%20moreTips and Edge Cases
Double-encoding
If you encode a string that's already encoded, the % signs themselves get encoded into %25, resulting in %2520 instead of %20. Always decode first if you're unsure whether your input is already encoded.
Plus signs in query strings
Some systems use + to represent a space in query strings (the application/x-www-form-urlencoded format). Percent-encoding uses %20. The two are equivalent in most query string contexts but not in path segments.
Fragment identifiers
The # character starts a fragment identifier. If your URL contains a hash and you only want to encode the path or query string, be careful not to encode the # itself.