URL Encoder Decoder Tool — Encode & Decode URLs Online Without Installing Anything [2026]
You received a URL that looks like this: https://example.com/search?q=coffee%20%26%20donuts. Or you need to pass a callback URL as a parameter, but it contains slashes and ampersands that break the outer query string. This step-by-step guide shows you exactly how to encode or decode any URL in your browser — without installing any software, without uploading anything, and without exposing sensitive query parameters to a third-party server.
Table of Contents
Why you need to encode or decode a URL
URLs can only safely carry a limited character set. Characters like spaces, ampersands (&), equal signs (=), slashes (/), question marks (?), and hash signs (#) have specific structural meanings. When they appear inside a parameter value, they break the URL parser's ability to understand where one part ends and the next begins.
Encoding is needed when you are building a URL: constructing a search query with user input, passing a redirect URL as a parameter, building an API request where parameter values contain special characters, or forming a link where the displayed text becomes a URL component.
Decoding is needed when you are reading a URL: making sense of a percent-encoded link someone sent you, debugging a 400 Bad Request to understand what the server actually received, extracting the value of a URL parameter that contains encoded characters, or reading log files that contain raw URL-encoded request paths.
Both operations require no software installation. Every modern browser includes JavaScript's native encodeURIComponent and decodeURIComponent functions, and the SammaPix URL Encode / Decode tool exposes those functions through a simple interface — paste, click, copy.
How to encode a URL parameter: step by step
The most common encoding task: you have a piece of data (a search term, a user name, a file path, a redirect URL) and you need to embed it safely inside a URL as a query parameter value. Here is the exact process.
- Open sammapix.com/tools/url-encode-decode. No install, no account. Works in any browser.
- Paste your raw value. Paste only the parameter value — not the full URL, not the key name, just the value. For example, if you want to pass the search term "coffee & donuts", paste that string. If you want to pass a redirect URL like
https://app.com/profile?id=42&tab=settings, paste the full redirect URL. - Click Encode. The tool applies
encodeURIComponent. Every character except letters, digits, hyphen, underscore, period, and tilde is converted to its%XXform. - Copy the encoded result. The output is
coffee%20%26%20donutsfor the search term, orhttps%3A%2F%2Fapp.com%2Fprofile%3Fid%3D42%26tab%3Dsettingsfor the redirect URL. - Append it to your URL. Use it as the value in your query string:
https://api.example.com/search?q=coffee%20%26%20donuts, or for the redirect:https://auth.example.com/login?next=https%3A%2F%2Fapp.com%2Fprofile%3Fid%3D42%26tab%3Dsettings.
Critical rule: encode the value only, not the entire URL. Encoding the full URL with encodeURIComponent would encode the :// and the ? that separate scheme from host and path from query — destroying the URL's structure. Only encode the pieces of data you are embedding as values.
How to decode a percent-encoded URL: step by step
You received a URL like https://example.com/search?q=caf%C3%A9%20au%20lait%20%26%20croissant&lang=fr and want to read it in plain text. Or you are reading server logs and trying to understand what values arrived in a request. The decode process is the reverse of encoding.
- Open sammapix.com/tools/url-encode-decode.
- Paste the percent-encoded string. You can paste the full URL or just the encoded parameter value. For a full URL, decode to see the query string in readable form. For a specific value, paste just the value portion.
- Click Decode. The tool applies
decodeURIComponent. Every%XXsequence is replaced with the corresponding UTF-8 character.%20→ space,%26→ &,%C3%A9→ é. - Read or copy the result. The decoded output for the example above:
https://example.com/search?q=café au lait & croissant&lang=fr. Now you can read what the original search query was.
If the input contains a malformed sequence (an incomplete or invalid %XX code), the tool displays an error message rather than crashing silently. This helps you identify the exact problematic character in a poorly formed URL.
Encode or decode any URL — runs instantly in your browser
Native encodeURIComponent / decodeURIComponent. No install, no server, no upload. Free.
Open URL Encoder / Decoder, FreeEncoding a component vs encoding a full URL
The most important conceptual distinction in URL encoding is whether you are encoding a piece of data (a component) or the URL itself. This determines which encoding function applies.
| What you are encoding | Correct function | Example | Why |
|---|---|---|---|
| A query parameter value | encodeURIComponent | coffee & donuts → coffee%20%26%20donuts | Must encode & and = so they are not mistaken for URL structure |
| A path segment with special chars | encodeURIComponent | my folder/file → my%20folder%2Ffile | The / must not create spurious path segments |
| A redirect URL as a parameter | encodeURIComponent | https://x.com/?a=1 → https%3A%2F%2Fx.com%2F%3Fa%3D1 | The entire URL is a data value — all structural chars must be encoded |
| A full URL with non-ASCII chars | encodeURI | https://x.com/café → https://x.com/caf%C3%A9 | Encodes non-ASCII but preserves : // / ? & = so the URL stays valid |
The SammaPix URL Encode / Decode tool uses encodeURIComponent for encoding, making it the correct tool for encoding data values. For encoding a full URL to make it safe to paste in a browser, the browser itself will handle it — type or paste a URL with spaces directly and the browser encodes it automatically. You rarely need encodeURI in practice.
Common errors and how to fix them
URL encoding errors are often silent — they do not always throw an error. Instead, a request succeeds but returns wrong data, or a link redirects to the wrong page. Here are the patterns that cause the most debugging time.
| Error | Symptom | Fix |
|---|---|---|
| Double encoding | %20 becomes %2520 in the final URL. Server receives wrong value. | Encode each raw value exactly once. Decode first if input may already be encoded. |
| Using encodeURI on parameter values | & and = are not encoded. Query string splits incorrectly at the unencoded &. | Always use encodeURIComponent for parameter values. |
| Unencoded # in a value | Everything after the # is treated as a fragment, not sent to the server. | Encode # as %23 in any parameter value containing a hash sign. |
| Malformed percent sequence | decodeURIComponent throws URIError. Request fails or returns 400. | Check for truncated copy-paste. Paste into the decode tool to see the error position. |
| + decoded as a literal plus sign | Search query shows "hello+world" instead of "hello world". | Replace + with %20 before decoding, or use a form-specific decoder if input is form-encoded. |
| Encoding the full URL instead of the value | The URL becomes one giant encoded string — browser cannot parse it. | Only encode the data values you embed in the URL, not the URL structure itself. |
Debug a broken URL — decode and check what arrived
Paste the raw or encoded URL and decode it to see what the server actually received. Catches double encoding, malformed sequences, and misused + signs.
Practical examples: API params, redirects, spaces and & characters
Here are the scenarios that come up most often in real development, with before and after examples showing exactly what encoding produces.
Example 1 — Search query with space and ampersand. A user types "coffee & donuts" into a search box. You need to pass it as the q parameter:
Input: coffee & donuts Encoded: coffee%20%26%20donuts Full URL: https://api.example.com/search?q=coffee%20%26%20donuts
Without encoding, the raw & would be interpreted as a query parameter separator, and the server would receive q=coffee and a second unnamed parameter donuts — a silently wrong result.
Example 2 — Redirect URL as a parameter. After login, redirect the user to their original destination. The destination URL is passed as a parameter:
Input: https://app.com/dashboard?tab=settings&plan=pro Encoded: https%3A%2F%2Fapp.com%2Fdashboard%3Ftab%3Dsettings%26plan%3Dpro Full URL: https://auth.example.com/login?next=https%3A%2F%2Fapp.com%2Fdashboard%3Ftab%3Dsettings%26plan%3Dpro
Example 3 — Decoding a URL received from a third-party system. You receive a webhook URL from a payment provider:
Received: https://myapp.com/webhook?event=payment.success&amount=29.99%20EUR&customer=Marie%20Curie Decoded: https://myapp.com/webhook?event=payment.success&amount=29.99 EUR&customer=Marie Curie
Example 4 — Non-ASCII characters (Unicode). A French product name containing accented characters:
Input: café au lait Encoded: caf%C3%A9%20au%20lait Full URL: https://shop.example.com/search?name=caf%C3%A9%20au%20lait
The é character encodes as %C3%A9 — its UTF-8 byte sequence (0xC3 0xA9) expressed as two percent-encoded bytes. Any Unicode character, including Chinese, Arabic, emoji, and diacritics, encodes the same way.
Why no-upload matters for URL encoding
URL encoding might seem like a trivial operation — it is, after all, just character substitution. But the strings you encode or decode frequently contain sensitive data. Consider what commonly appears in URLs:
- Authentication tokens. OAuth tokens, JWT tokens, and session IDs often appear as query parameters in callback URLs. Pasting these into an online tool that sends them to a server exposes them.
- API keys. Developers sometimes embed API keys directly in URLs for quick testing. An encode/decode tool that logs inputs would capture these keys.
- Internal endpoint paths. URLs pointing to internal services, admin panels, or staging environments reveal infrastructure when logged by a third-party tool.
- User-submitted data. If you decode a URL containing user email addresses, names, or personal identifiers, exposing those to a server violates the data minimization principle of GDPR and similar regulations.
The SammaPix URL Encode / Decode tool makes no network requests during encoding or decoding. The computation happens entirely in your browser tab using native JavaScript functions. Open browser DevTools (F12), go to the Network tab, filter by XHR or All, and paste or type any string — you will see no outgoing requests carrying your input. The only requests the page makes are for its own assets (CSS, fonts, the JS bundle) on page load.
Developer tools that run in your browser — no upload, no server
URL encoding, hash generation, QR codes, Base64 encoding — all client-side.
Related tools
- URL Encode / Decode: the tool covered in this article. Native encodeURIComponent / decodeURIComponent. No upload, no server. See also: percent-encoding reference guide.
- Hash Generator: generate MD5, SHA-1, SHA-256, SHA-384, or SHA-512 hashes from text or files. Useful for checksums, file integrity, and verifying downloads. See hash generator guide.
- QR Code Generator: generate QR codes from any URL, text, Wi-Fi, email, or vCard. No signup, no expiry, download PNG or SVG. See QR code generator guide.
- Image to Base64: encode any image to a Base64 data URI for embedding in HTML, CSS, or API payloads. No upload, no server. See Image to Base64 guide.
FAQ
How do I encode a URL with spaces and special characters?
Paste the string containing spaces and special characters into the URL Encode / Decode tool at sammapix.com/tools/url-encode-decode and click Encode. The tool applies encodeURIComponent, which converts spaces to %20, ampersands to %26, equal signs to %3D, slashes to %2F, and all other non-unreserved characters to their %XX form. The result is safe to embed in any URL component. Example: 'coffee & donuts' becomes 'coffee%20%26%20donuts'.
How do I decode a URL that has %20, %26, and other percent codes?
Paste the percent-encoded string into the input field and click Decode. The tool applies decodeURIComponent, which reverses the encoding: %20 becomes a space, %26 becomes &, %3F becomes ?, %2F becomes /, and so on. If the input is malformed (an incomplete % sequence or an invalid byte), the tool catches the error and reports it rather than crashing silently. The decoded output is the original human-readable string.
What is the difference between encoding a URL component and encoding a full URL?
Encoding a component (a single parameter value, a path segment, or any piece of data embedded in a URL) uses encodeURIComponent, which encodes all characters except letters, digits, and - _ . ! ~ * ' ( ). This is the correct approach for parameter values. Encoding a full URL uses encodeURI, which preserves the structural characters of the URL — : / ? # [ ] @ & = + $ ; , — so the URL remains parseable. The critical difference: encodeURI does NOT encode & and =, so it is wrong for parameter values. encodeURIComponent DOES encode them, which would break a full URL's structure. Use encodeURIComponent for values; use encodeURI (rarely) for a complete URL you need to make safe without breaking.
What happens if I try to decode a malformed percent-encoded string?
A malformed percent-encoded string is one where a % is not followed by exactly two valid hexadecimal digits. For example: %2G (G is not hex), %2 (incomplete), or a bare % at the end of the string. JavaScript's decodeURIComponent throws a URIError for malformed input rather than silently returning a wrong result. The SammaPix URL Encode / Decode tool catches that error and displays a clear message so you can identify the invalid sequence. Common causes: copy-paste errors that truncated the encoded string, manual editing that broke a % sequence, or receiving a URL that was only partially encoded by a broken system.
Does this tool work without internet? Can I use it offline?
Yes, once the page is loaded, the URL Encode / Decode tool works without an active internet connection. The encoding and decoding logic runs in JavaScript natively in your browser — it makes no network requests. If you load the page once and then disconnect from Wi-Fi, the tool continues to work. This is also why the tool is suitable for sensitive data: credentials, API keys, or internal endpoints embedded in URLs never leave your device, regardless of your network status.
How do I encode a redirect URL to use as a parameter?
A redirect URL is itself a complete URL — it contains slashes, question marks, ampersands, and other characters that would corrupt the outer URL if left unencoded. The correct approach: paste the full redirect URL into the encode field and click Encode. The entire URL is treated as a value and all its structural characters are encoded. Example: 'https://app.com/dashboard?tab=settings&mode=edit' becomes 'https%3A%2F%2Fapp.com%2Fdashboard%3Ftab%3Dsettings%26mode%3Dedit'. You then append that encoded string as a parameter value: 'https://auth.example.com/login?redirect=https%3A%2F%2Fapp.com%2Fdashboard%3Ftab%3Dsettings%26mode%3Dedit'.
Why does my decoded URL look different from what I expect?
If a decoded URL looks unexpected, the most common reasons are: 1) The input was double-encoded — a string that was already percent-encoded was encoded again, so %20 became %2520. Decode it twice: once to get %20, then again to get the original space. 2) The encoding used + for spaces (HTML form encoding) rather than %20. The tool's decodeURIComponent treats + as a literal plus sign, not a space — to decode + as spaces you need to replace + with %20 first. 3) The input was truncated — a copy-paste operation cut off part of the string, leaving incomplete % sequences. Check that you copied the entire encoded string.
Is this URL encoder and decoder tool private?
Yes. The SammaPix URL Encode / Decode tool runs entirely in your browser using JavaScript's built-in encodeURIComponent and decodeURIComponent functions. Nothing you type or paste is sent to any server. No analytics events capture the content of your input. You can verify this with browser DevTools: open the Network tab, type or paste a string, and click Encode or Decode — you will see no outgoing requests containing your data. This matters because URLs frequently carry sensitive information: authentication tokens, session IDs, API keys, internal endpoint paths, and personal search queries.
