URL Encoder & Decoder: A Complete Guide for Developers
Spaces, ampersands, and special characters break URLs unless they're properly encoded. Learn how URL encoding works and when to use each variant.
Try the tool right now
URL Encoder/Decoder
What is URL Encoding?
URL encoding (also called percent encoding) is a way to safely include special characters in URLs. URLs can only contain a specific set of characters — letters, digits, and a few symbols. Anything outside that set must be replaced with a percent sign followed by two hexadecimal digits.
For example, a space character becomes %20, an ampersand becomes %26, and a question mark becomes %3F. This is what allows you to put arbitrary text — including emojis, non-Latin alphabets, and reserved symbols — into a URL without breaking it.
When You Need to URL Encode
URL encoding is essential whenever you build URLs dynamically. Common scenarios include:
- Query parameters — When passing user input through ?search=hello%20world
- Form submissions — Both GET and POST forms encode values for transmission
- API requests — REST APIs require encoded path parameters and query strings
- Sharing links with special characters — A URL with #, &, or = embedded in values
- Dynamic routes — Slugs containing apostrophes, ampersands, or non-ASCII characters
- OAuth flows — Redirect URIs and state parameters must be encoded
encodeURI vs encodeURIComponent: Critical Difference
JavaScript provides two encoding functions. Choosing the wrong one is one of the most common mistakes developers make when building URLs:
Rule of thumb: when encoding a value to put into a URL, almost always use encodeURIComponent. encodeURI is only for fixing entire URLs that already exist.
encodeURI() — Full URL encoding
Encodes only characters that are illegal anywhere in a URL. It preserves URL structure characters like /, ?, &, =, and #. Use this when you have a complete URL that just needs problematic characters fixed.
encodeURIComponent() — Component encoding
Encodes everything that has special meaning in a URL — including /, ?, &, =, #, +, $, and more. Use this for individual query parameter values and path segments where the value should not be interpreted as URL syntax.
How to Use Our URL Encoder/Decoder
Our free online tool handles both encoding and decoding with a clear toggle:
- Choose 'Encode' or 'Decode' mode
- Pick 'Component' for query values, or 'Full URL' to preserve URL structure
- Paste your text or URL into the input box
- Click the action button and copy the result
The 'Swap' button lets you reverse direction quickly — useful when verifying that an encoded URL decodes back to your original input.
Common URL Encoding Mistakes
Double encoding
Calling encodeURIComponent on already-encoded text turns %20 into %2520. Always check whether your input is raw or already encoded before applying encoding.
Encoding the entire URL with encodeURIComponent
This breaks the URL because it encodes the slashes and protocol. Use encodeURI for full URLs, encodeURIComponent only for individual values within them.
Forgetting to encode user input
If users can submit text containing &, =, or #, your URLs will break unless those values are encoded before being concatenated.
Treating + as a space
In URL paths, + is a literal plus sign (encoded as %2B if you want it literal). In query strings (form data), + is sometimes interpreted as a space due to legacy form encoding.
Reserved Characters You Should Always Encode
These characters have special meaning in URLs and should be encoded when they appear in values:
- Space → %20 (or + in query strings)
- & → %26 (separates query parameters)
- = → %3D (separates parameter name from value)
- ? → %3F (starts the query string)
- # → %23 (starts the URL fragment)
- / → %2F (separates path segments)
- : → %3A (separates protocol from rest of URL)
- + → %2B (otherwise interpreted as space in query strings)
Final Thoughts
URL encoding is one of those topics that seems trivial until a single broken character takes down a feature in production. Whether you are building API clients, generating share links, or debugging why a query parameter is not arriving correctly, our free URL encoder and decoder gets you the right answer in seconds. And since everything runs in your browser, even sensitive URLs containing tokens or credentials never leave your device.
Try URL Encoder/Decoder NowFrequently Asked Questions
What is the difference between encodeURI and encodeURIComponent?
encodeURI is for full URLs and preserves URL structure characters like /, ?, &, =. encodeURIComponent encodes everything special, including /, ?, &, =. Use encodeURIComponent for individual query values, and encodeURI for fixing whole URLs.
Why do spaces sometimes show as %20 and other times as +?
%20 is the percent-encoded space used in URL paths. The + symbol is a legacy form-encoding convention from HTML forms, only used in query strings. Modern code should use %20 everywhere; both are technically valid in query strings.
Are my URLs safe when using this tool?
Yes. All encoding and decoding happens in your browser using JavaScript. Your URLs — including any tokens, IDs, or sensitive parameters — are never sent to any server.
What characters are safe in a URL without encoding?
Letters (a-z, A-Z), digits (0-9), and these symbols: - . _ ~. Everything else should be percent-encoded when used in a URL value.
Can I decode a URL that was encoded multiple times?
Yes, but you need to decode it the same number of times. If a URL was double-encoded, decode once to get a partially decoded version, then decode again to get the original. Our tool decodes one level per click.
Related Articles
Base64 Encoder & Decoder: Free Online Tool with UTF-8 Support
Base64 encoding is everywhere — emails, data URIs, JWTs, and APIs. Learn what Base64 actually does, when to use it, and how to encode or decode it in seconds.
JSON Formatter Online: Format, Validate & Beautify JSON (Free Tool)
Working with messy JSON? Learn what a JSON formatter does, why it matters for developers, and how to format any JSON in seconds with our free online tool.
JWT Decoder: Decode JSON Web Tokens Online (Free, Secure)
JWTs are everywhere in modern auth — but decoding one shouldn't require pasting it into a sketchy website. Learn how JWTs work and decode them safely in your browser.