encodeURI
Use for a whole URL when you want to preserve separators such as : / ? & = #.
Enter text above to compare modes.Developer utility
URL Encoder / Decoder with Mode Comparison
Encode URL components, compare encodeURI versus encodeURIComponent, and debug percent-encoded query strings, redirect URLs, and callback parameters.
0 chars
0 chars
Encode values, not the whole URL, when building query strings. Encoding a complete URL with encodeURIComponent can turn separators such as : / ? and & into data.
Encoding mode comparison
Paste a sample once and see which encoding mode preserves URL structure versus safely encoding a single value.
encodeURIComponent
Use for a single query value, path segment, redirect value, or form field.
Enter text above to compare modes.decodeURIComponent
Use when inspecting a percent-encoded value. Invalid escapes are reported instead of guessed.
Enter text above to compare modes.Common use case
Encode a search term, callback path, OAuth state value, or campaign parameter before adding it to a query string.
Avoid double encoding
If %20 becomes %2520, the value was encoded twice. Decode once and check what the receiving system expects.
Security note
URL encoding is not encryption. Tokens, emails, and IDs in URLs can still be exposed in logs, browser history, and referrers.
🔗encodeURI🧩encodeURIComponent↩Decode🏗Query Builder🔍Diagnostics
Common URL encoding mistakes (and how to fix them)
These are the most frequent encoding errors developers encounter.
Watch outEncoding an entire URL
https://api.example.com/v1/search?q=hello world
Why it is a problem
Encoding the full URL with encodeURIComponent turns ://, /, and ? into percent-encoded characters, breaking the URL structure. Only query parameter values should be percent-encoded, not the URL skeleton.
How to fix
Use encodeURIComponent for individual parameter values, not the whole URL. Use encodeURI if you need to encode a full URI while preserving the structural characters.
Watch outDouble encoding
%2520
Why it is a problem
Encoding an already-encoded string produces double-encoded output. %20 (% encoded space) becomes %2520 (%25 is the percent sign itself). The URL will not decode to the intended value.
How to fix
Decode once to check whether the string is already encoded. If decoding produces readable text, do not encode again. Apply encoding exactly once, at the point where the value is inserted into a URL.
Watch outConfusing + with %20
hello+world%20test
Why it is a problem
In query strings, + represents a space (application/x-www-form-urlencoded convention), but %20 also represents a space (percent-encoding). Mixing them can cause inconsistent decoding behavior across servers.
How to fix
Use %20 for spaces in path segments and encodeURIComponent output. Be aware that + in query strings is a legacy convention — modern APIs may or may not treat + as a space.
Watch outDecoding untrusted input
%3Cscript%3Ealert(1)%3C%2Fscript%3E
Why it is a problem
Decoding percent-encoded text does not make it safe. If the decoded value is inserted into HTML, it can execute scripts. %3Cscript%3E decodes to <script>, which is dangerous in an HTML context.
How to fix
Always validate or sanitize decoded values before using them in HTML, SQL, or shell commands. URL decoding is a data transformation, not a security measure.
Watch outIgnoring reserved characters
price=100% & discount=10%
Why it is a problem
The % character must always be followed by two hex digits in percent-encoding. A lone % or % followed by non-hex characters is an invalid escape sequence and may cause parse errors or data loss.
How to fix
Encode literal percent signs as %25. When building query strings programmatically, always use a proper URL encoding function rather than manual string concatenation.
Real-world use cases
Building API query strings
Encode search terms, filter values, and user-provided parameters before appending them to a URL. This prevents broken requests when values contain spaces, ampersands, or non-ASCII characters.
Preparing redirect URLs
When constructing an OAuth redirect_uri or a return URL inside a query parameter, encode the inner URL to prevent its special characters from interfering with the outer URL's structure.
Debugging malformed percent escapes
Paste a URL that is not behaving as expected. The diagnostics panel highlights invalid escape sequences and double-encoding so you can fix the URL at its source.
Cleaning URL fragments for QR codes
QR codes work best with clean, properly encoded URLs. Encode any query parameters before embedding them in a QR code to maximize scan reliability across different reader apps.
Inspecting encoded webhook payloads
Webhook delivery URLs often include percent-encoded callback parameters. Decode them to verify the intended destination before configuring the webhook in production.
Comparing encodeURI vs encodeURIComponent
Use the live comparison panel to understand the difference: encodeURI preserves / ? # & while encodeURIComponent encodes them. Choose the right function for your specific use case.
Frequently asked questions
What is the difference between encodeURI and encodeURIComponent?
encodeURI is designed for encoding a complete URI and preserves characters that have structural meaning: / ? # & = : @. encodeURIComponent encodes those characters too, making it suitable for encoding individual query parameter values or path segments. Getting this wrong is the most common URL encoding mistake.
When should I decode a URL?
Decode when you need to display a URL value to a human, extract the original text for processing, or inspect what a percent-encoded string actually contains. Be aware that decoding untrusted input does not sanitize it — the decoded value may still contain dangerous content for HTML or SQL contexts.
What is double encoding and why does it happen?
Double encoding occurs when an already-encoded string is encoded again. %20 becomes %2520 (the % sign itself gets encoded as %25). This often happens in systems where encoding is applied at multiple layers — the frontend encodes, then the backend encodes again. The diagnostics panel detects common double-encoding patterns.
Is URL encoding a form of encryption?
No. URL encoding is a reversible character substitution designed for transport, not secrecy. Anyone can decode a percent-encoded string back to its original form. Do not rely on URL encoding to hide sensitive data — the values remain visible in browser address bars, server logs, and network traces.
Why do some URLs use %20 and others use + for spaces?
The application/x-www-form-urlencoded format (used in HTML form submissions) encodes spaces as +. The more general percent-encoding scheme (RFC 3986) encodes spaces as %20. Modern best practice is to use %20 everywhere and avoid + for spaces, as + in path segments is treated literally by many servers.
Can I encode an entire URL in one step?
Only with encodeURI, which preserves the URL's structural characters. But the safer approach is to encode each component separately: use encodeURIComponent for query parameter values, and keep the base URL structure intact. This gives you precise control and avoids accidentally breaking the URL syntax.
Related tools you might need
🔐
Base64 Encode/Decode
📱Encode text to Base64 or decode Base64 strings — another reversible transform, for different use cases.
QR Generator
📋Generate QR codes from encoded URLs and text for sharing and scanning.
JSON Formatter
🔗Format and validate JSON — common source of URL-encoded API payloads.
Text to Slug
Convert text to URL-friendly slugs with configurable separators.
Tool guide
About URL Encoder & Decoder
URL encoding converts unsafe or reserved characters into percent-encoded sequences so values can be safely placed in query strings, paths, or form submissions. Decoding reverses those sequences for inspection.
Use this tool when debugging copied URLs, API query parameters, redirects, and callback URLs. Encode only the component you need, not necessarily the entire URL.
Privacy note
Most FreeToolsBox tools run directly in your browser for processing. Some pages may still load analytics, ads, or third-party services. Avoid entering passwords, private keys, production tokens, personal IDs, or other sensitive data.
Validation-grade guide
How to use URL Encoder & Decoder well
Best for
Encode and decode URL components, query parameters, and percent-encoded text.
Prevents broken links by showing how spaces, Unicode, and reserved characters should appear inside URLs.
Example workflow
- Input: search?q=free tools & emoji=✅
- Action: Encode the value before adding it to a query string.
- Expected result: Spaces, Unicode, and reserved symbols are represented safely with percent encoding.
Quality checks
- Uses explicit encode/decode actions for URL components.
- Surfaces malformed percent escapes as errors.
- Pairs naturally with QR generation and API debugging workflows.
Watch out for
- Encoding a whole URL and encoding one query parameter are different tasks.
- Double-encoding can produce broken links.
- Malformed escape sequences should be fixed before decoding.
Do not use it for
- Hiding sensitive parameters in a URL.
- Decoding untrusted URLs without reviewing the destination domain.
What to measure in the 90-day validation
- tool_used:encode
- tool_used:decode
- tool_error rate
- tool_copied
Encoding and decoding run locally in the browser; URLs may still reveal data when shared or opened.
Learn the concept
URL encoding for query parameters
Learn when to encode a query parameter, how percent encoding works, why double encoding breaks links, and how to debug malformed escape sequences.
Read the guide →Common use cases
- Encode query parameter values before testing an API.
- Decode redirect URLs and callback parameters.
- Inspect tracking parameters in a copied URL.
- Troubleshoot spaces, ampersands, and non-ASCII characters in URLs.
Examples
- Encode a search query such as free tools & json before placing it in a query parameter.
- Decode a percent-encoded URL from logs to inspect the readable path and parameters.
- Encode Unicode text before adding it to a link that will be shared in a QR code or email.
Practical tips
- Encode individual query parameter values instead of blindly encoding an entire URL.
- Watch for double-encoded values such as %2520, which often means a value was encoded twice.
- Do not treat URL encoding as a privacy or security layer; encoded values are easy to decode.
Related tools
Frequently asked questions
What is URL encoding?
URL encoding replaces characters with percent-encoded byte sequences so they can be safely used in URLs.
Should I encode the whole URL or only part of it?
Usually encode only a component such as a query parameter value. Encoding the whole URL can encode separators like : and /.
Why do I see %20 in URLs?
%20 is the encoded representation of a space character in many URL contexts.
Is URL Encoder & Decoder free to use?
Yes. URL Encoder & Decoder is free to use in your browser with no signup required.
Is my data uploaded when I use URL Encoder & Decoder?
Most FreeToolsBox tools process data locally in your browser. Some pages may load analytics, ads, or third-party services. Avoid entering sensitive data on any online page.
What can I use URL Encoder & Decoder for?
Free online URL encoder and decoder. Encode special characters for safe URLs or decode encoded URLs back to readable text.