🔗 URL Encoder / Decoder
Encode special characters for URLs or decode percent-encoded strings. Runs in your browser.
https://example.com/search?q=hello%20world&lang=en&tag=c#code
Examples
What characters need to be percent-encoded in a URL?
URLs can only contain letters (A-Z, a-z), digits (0-9), and a few special characters (-, _, ., ~). All other characters must be percent-encoded as %XX where XX is the hexadecimal byte value. Common encodings: space = %20, & = %26, = = %3D, + = %2B, / = %2F, ? = %3F, # = %23, @ = %40. Non-ASCII characters (accented letters, Chinese characters, emoji) are first encoded as UTF-8 bytes, then each byte is percent-encoded. The Japanese character 東 becomes %E6%9D%B1 (three bytes encoded).
What is the difference between encodeURI and encodeURIComponent in JavaScript?
encodeURI encodes a complete URL and preserves characters with URL-structural meaning: /, :, ?, #, &, =, +, @. Use for encoding a full URL like https://example.com/path?q=hello world (only the space becomes %20). encodeURIComponent encodes a URL component (a query parameter value or path segment) and encodes ALL special characters including /, ?, #, &, and =. Use for individual parameter values: encodeURIComponent('hello & world') = 'hello%20%26%20world'. The common mistake: using encodeURI on a query parameter value — the & and = are left unencoded, breaking URL structure.
Why does a space sometimes encode as + and sometimes as %20?
Both represent a space, but in different contexts. %20 is the standard percent-encoding for a space in any URL component per RFC 3986. The + sign as a space comes from the application/x-www-form-urlencoded format (HTML form submissions) — only valid in query strings, not path segments. Most servers and query string parsers accept both. For new code: use %20 in programmatically constructed URLs (unambiguous). encodeURIComponent() in JavaScript produces %20 — the correct choice.
How do I encode a URL that contains another URL as a query parameter?
The inner URL must be fully encoded as a component — every character with URL meaning (/, ?, #, &, =, :) must be percent-encoded so the outer URL parser does not interpret them. Example: the redirect URL parameter in OAuth: https://auth.example.com/login?redirect=https%3A%2F%2Fapp.example.com%2Fcallback%3Fstate%3Dabc. In JavaScript: const redirectUrl = encodeURIComponent('https://app.example.com/callback?state=abc'). Using encodeURI on the inner URL instead leaves :, /, ?, and = unencoded, breaking the outer URL's query string parsing.
What characters are safe in a URL path segment without encoding?
Unreserved characters are always safe: A-Z, a-z, 0-9, -, _, ., ~. Sub-delimiters often safe in path segments: !, $, &, ', (, ), *, +, ,, ;, =. The @ character is safe in path segments. The / character delimits path segments — encode as %2F if it appears within a segment. For SEO-friendly URLs: use only lowercase a-z, 0-9, and hyphens. Hyphens are preferred over underscores because Google treats hyphens as word separators in slugs.
How do I decode a mangled URL that has been double-encoded?
Double-encoding happens when a URL is encoded twice: space → %20 → %2520 (the % gets encoded to %25). Decoded once: %2520 gives %20 (literal percent-twenty). Decoded twice: you get the space. This tool decodes one layer at a time. If the decoded output still contains %XX sequences, paste it back and decode again. To prevent double-encoding in code: encode once at the point of string construction, never encode an already-encoded string, and store URLs in decoded form internally.
What other encoding tools complement the URL encoder?
The Base64 Encoder handles base64-encoding often used for OAuth tokens and Basic Auth credentials in URLs. The HTML Encoder handles escaping < > & characters for HTML attribute contexts. The JWT Decoder is useful when a URL contains a JWT as a query parameter (JWTs use Base64URL encoding). All are in the Dev Tools Encoders section.
📊 Key Data Points
RFC 3986
The URI standard defining percent-encoding — implemented by this tool
%20 vs +
Both encode a space — %20 is RFC-correct, + is form-data specific
128 ASCII
Only unreserved ASCII characters are safe unencoded in URLs
URL Encoder / Decoder -- Complete USA Guide 2026
URLs only allow letters, digits, and a handful of symbols. Every other character must be percent-encoded as %XX hex bytes before it can be safely transmitted. Misencoded URLs cause 400 errors, broken redirects, and query parameters that silently drop data.
This tool runs in your browser. Paste any URL, query string, or parameter value and get the correctly encoded or decoded version instantly.
**Long-tail searches answered here:** how to percent-encode a URL with special characters online, decode %2F %20 %26 URL encoding free, difference between encodeURI and encodeURIComponent.
After encoding, test your full URL with the curl Builder.
🔬 How This Calculator Works
The encoder uses encodeURIComponent() for individual parameter values and encodeURI() for full URLs (preserves structural characters like /, ?, #, &, =). The decoder uses decodeURIComponent() which reverses all percent-encoding: %20 to space, %2F to /, %26 to &.
Choosing the right function: For encoding a query parameter value, use encodeURIComponent — it encodes & and = so they cannot break the query string structure.
✅ What You Can Calculate
Encode query parameters safely
Encode search terms, email addresses, and file paths before appending them as query parameters. Prevents & and = characters from breaking your URL structure.
Decode percent-encoded strings
Reverse %2F, %20, %26, %3D back to readable form. Essential for debugging redirect URLs and OAuth callback parameters.
Full URL vs component encoding
Toggle between encodeURI (preserves URL structure) and encodeURIComponent (encodes everything). Prevents the common mistake of breaking all slashes when encoding a full URL.
No size limit, runs offline
Runs using native Web APIs. Once loaded, works without internet — useful when debugging API integrations on unreliable connections.
🎯 Real Scenarios & Use Cases
Building API query strings
Pass a user-typed search query as a URL parameter. Encode it first so spaces become %20 and special characters do not break the request structure.
Debugging redirect chains
OAuth flows, payment callbacks, and SSO redirects use URL-encoded redirect_uri parameters. Paste the encoded value here to see the actual destination URL.
Fixing broken links
A CMS generated a URL with unencoded spaces. Encode it here to get a browser-safe version that will not 400 on most servers.
Understanding third-party API calls
A third-party SDK generates a URL you want to inspect. Decode the query string here to read the actual parameter values being sent.
💡 Pro Tips for Accurate Results
encodeURIComponent for values, encodeURI for full URLs. Applying encodeURIComponent to a full URL encodes the slashes and colons, breaking the URL entirely.
Double-encoded URLs are a nightmare. If you encode an already-encoded URL, %20 becomes %2520. Always decode first to check before re-encoding.
Plus vs %20 in forms. HTML forms encode spaces as + in application/x-www-form-urlencoded. In a URL path, only %20 means space.
Chain with curl Builder. Build your full request with properly encoded parameters, then copy the curl command for testing.
🔗 Use These Together
🏁 Bottom Line
URL encoding is one of those fundamentals that causes production bugs disproportionate to its apparent simplicity. A single unencoded & in a query parameter silently truncates the value. This tool handles both encoding and decoding with correct RFC 3986 semantics.
For the complete request-building workflow: encode here, build the full request with curl Builder, and inspect response headers with HTTP Headers Analyzer.