Online URL Encoder and Decoder for Percent Encoding, Query Strings, and Form Mode
Encode and decode URL content locally in the browser, with separate modes for text values, full URLs, and query strings. Useful for API requests, callback links, OAuth redirect_uri values, UTM parameters, logs, and URL components containing spaces, Unicode, or emoji.
- All encoding and decoding happens locally in the browser with no server upload
- Supports standard percent-encoding for query parameters, path segments, and callback URLs
- Includes application/x-www-form-urlencoded mode for spaces and + handling
- Real-time conversion with one-click copy and practical examples
URL Encode & Decode
Encode and decode URL percent-encoding, query parameters, full URLs, and form-mode payloads for API debugging, callbacks, logs, and Unicode parameters.
Text/value mode processes the whole input as one component.
What this page can do
URL handling is split by context: encode a single value, preserve a full URL, or process query parameters item by item so structure characters are not accidentally changed.
-
Encode to percent-encoding
Convert spaces, Unicode text, emoji, and reserved symbols into percent-encoded output for query values, path segments, and callback URLs.
-
Decode from percent-encoding
Turn %XX sequences from browser URLs, logs, redirects, and third-party callbacks back into readable text for inspection.
-
Form-data mode
Handle the space and + convention used by application/x-www-form-urlencoded payloads, form posts, and legacy query strings.
-
Full-encode mode
Full URL mode preserves structure characters such as :, /, ?, &, =, and #, while value mode treats them as plain content.
-
Bidirectional swap
Send output back into the input area to compare strict decode, tolerant decode, form mode, and standard percent-encoding behavior.
-
Instant copy and clear
Copy clean results into API clients, code snippets, or documentation, then clear the editor for the next link.
How to use this page
Pick the right processing target, paste the content, and convert without mixing URL structure with parameter values.
- 1
Select Encode or Decode to set the conversion direction.
- 2
Type or paste your input into the text area.
- 3
The result updates in real time in the output area.
- 4
Use Copy to grab the output, or Swap to exchange input and output.
- 5
Toggle form-data mode or full-encode mode depending on your use case.
When to use each mode
The same characters should be treated differently depending on whether they are part of a full URL, a single value, or form data.
- Use text/value mode for one parameter value so ?, &, and = are encoded as content.
- Use full URL mode for an already assembled URL so the protocol, path, query string, and fragment stay intact.
- Use query mode when you only need to transform a=1&b=2 style parameters, with control over keys and values.
- Enable form mode when plus signs should be interpreted as spaces in form payloads or legacy query strings.
Common use cases
URL encoding issues often hide in parameter boundaries, space conventions, redirects, and multi-layer tracking links.
-
Query parameter encoding
Encode search terms, filters, pagination state, and multilingual tags before appending them to a query string.
-
API request preparation
Encode path segments and parameter values separately when composing REST requests, webhook URLs, or temporary debugging links.
-
Form submission debugging
Decode form payloads from developer tools, gateway logs, or server logs to verify the actual submitted values.
-
Data extraction from URLs
Inspect redirect chains, OAuth callbacks, SSO parameters, and share links by decoding fields such as redirect_uri, state, and next.
-
Multilingual parameter handling
Handle Chinese, Japanese, Korean, emoji, and mixed punctuation consistently across browsers, proxies, and backend frameworks.
-
Campaign and tracking link cleanup
Clean up UTM fields, ad redirects, and channel links that contain nested or repeated encoding before reporting or archiving.
Practical guidelines
Most URL mistakes come from missing context. Decide where the text will live before choosing the encoding rule.
- First identify whether the input is a full URL, one parameter value, or a query string. That choice controls which characters must be preserved.
- If the string already contains segments such as %E4%BD%A0, decode and inspect it before encoding again to avoid turning % into %25.
- For API parameters, think in encodeURIComponent terms; for complete URLs, preserve structural characters such as :, /, ?, &, =, and #.
- Use form mode only for application/x-www-form-urlencoded data. General URL parameters usually represent spaces as %20 rather than +.
- Leftover isolated percent signs, half UTF-8 sequences, or unreadable output usually means the source log was truncated, escaped twice, or mixed with non-URL-encoded text.
- URL encoding is a transport-format tool, not a privacy or security layer. Inspect tokens, signatures, or hashes separately when credentials are involved.
- Document team rules for spaces, Unicode, array parameters, and redirect_uri values so frontend and backend code do not drift apart.
For auth headers, API credentials, or text that needs Base64 conversion, use the Base64 Encode & Decode tool. For Token header, payload, and expiry inspection, open the JWT Inspector tool. When the task expands from one parameter to full URL parsing, domains, paths, query items, and fragments, pair this page with URL Tools .
Limitations and important notes
Knowing the boundaries helps avoid surprises during conversion.
- Percent-encoding is a formatting convention, not a security mechanism. It does not encrypt, hash, or protect data in any way.
- Double-encoding happens when an already-encoded string is encoded again. This page does not automatically detect double-encoding.
- Very long input strings may cause performance slowdowns in browser rendering. This page is designed for typical text payloads.
- This page uses the browser native encodeURI, encodeURIComponent, decodeURI, and decodeURIComponent APIs for standard encoding operations.
- Form mode focuses on the common space and + difference; it does not simulate a complete form serialization pipeline.
- Tolerant decode is designed for dirty or legacy inputs; use strict mode for protocol validation and QA checks.
- Query mode assumes standard & and = separators. Custom protocols, nested query strings, and unusual delimiters may need manual review first.
Frequently asked questions
Answers to common questions about usage, data handling, result checks, and practical limits.
01 What is URL encoding?
What is URL encoding?
URL encoding, also known as percent-encoding, converts characters that should not appear directly in a URL into a % followed by two hexadecimal digits. It solves a formatting problem: how text should be represented inside a URL.
02 What is the difference between encodeURIComponent and encodeURI?
What is the difference between encodeURIComponent and encodeURI?
encodeURIComponent is for one component or value, so it encodes ?, &, and =. encodeURI is for an already assembled full URL, so it preserves structure characters such as /, ?, and &.
03 Why does the decoded output show %XX sequences sometimes?
Why does the decoded output show %XX sequences sometimes?
The input may have been encoded more than once, or the original text may literally contain %XX. You can decode the result again, but only after confirming those characters are not meaningful business content.
04 What is the application/x-www-form-urlencoded format?
What is the application/x-www-form-urlencoded format?
It is a common encoding format for HTML forms where spaces are often represented as +. It matters most when debugging form requests, legacy query strings, and backend logs.
05 Does this page send my data to a server?
Does this page send my data to a server?
No. All encoding and decoding is performed locally in your browser using native JavaScript APIs. No data is transmitted to any server.
06 Can URL encoding prevent XSS attacks?
Can URL encoding prevent XSS attacks?
No. URL encoding is a formatting mechanism, not a security measure. Output encoding for XSS prevention follows different rules and should be handled separately.
07 Why should + sometimes be treated as a space?
Why should + sometimes be treated as a space?
In application/x-www-form-urlencoded payloads, spaces are commonly encoded as +. Enable plus-as-space decoding when handling form payloads and query strings from that format.
08 When should I choose strict vs tolerant decode mode?
When should I choose strict vs tolerant decode mode?
Use strict mode for validation and test environments, and tolerant mode when investigating malformed real-world data where partial decoding is still useful.
More encoding, decoding, and scannable code tools
DevKitLab provides online tools for Base64 encoding and decoding, URL encoding and decoding, QR code generation and parsing, barcode generation and parsing, and other tasks involving links, text, image encoding, and scannable codes.