URL Encoder / Decoder
Percent-encode text for safe use in URLs, or decode an encoded string back to readable text. Switch between encodeURIComponent and encodeURI, and run everything locally in your browser so your data stays completely private.
How to Encode or Decode a URL
- 1
Choose encode or decode
Select Encode to turn readable text into a percent-encoded form, or Decode to turn percent escapes back into the original characters. The tool processes your text as you type, so there is no button to press.
- 2
Pick the encode mode
When you are encoding, a second choice appears: Component or URI. Component uses encodeURIComponent for a single value such as one query parameter, while URI uses encodeURI for an entire URL where you want to keep structural characters like the slashes and the question mark.
- 3
Type or paste your text
Enter your text in the input box and the result appears immediately below. In decode mode the tool runs decodeURIComponent; if the input contains a malformed escape, it safely clears the output instead of crashing.
- 4
Copy or swap
Use the copy button to send the result to your clipboard. The swap button moves the current output back into the input and flips between encode and decode, which makes round-tripping a value quick and reliable.
Why Use a URL Encoder / Decoder?
The Right Function for the Job
Choosing between encodeURIComponent and encodeURI by hand is a frequent source of bugs. This tool exposes both as a clear Component-or-URI choice, so you escape a single value or a whole URL with the correct function instead of guessing.
Instant, Live Results
The output updates the moment you type. There is no submit step, which makes it fast to test how a particular character will be escaped or to confirm that a long encoded blob decodes into what you expected.
Completely Private
Encoding and decoding run entirely on the client. You can paste tokens, signed parameters, or any other sensitive string and decode it without any of it being logged or sent to a server.
No Setup, Works Everywhere
Nothing to install and no account to create. The encoder loads in any modern browser on desktop or mobile, so it is always at hand when you hit a stubborn %25 or %2F while debugging.
Common Scenarios
Escaping a Value for a Query String
When you need to drop a search term, a redirect target, or a JSON blob into a single query parameter, those values often contain spaces, ampersands, or slashes that would break the URL. Encode the value in Component mode and paste the safe result into your query string, confident that the reserved characters are correctly escaped.
Reading Encoded URLs From Logs
Server logs and analytics exports are full of percent-encoded URLs that are hard to read. Switch to Decode, paste the string, and the tool runs decodeURIComponent to reveal the original text, so you can quickly see exactly what a request contained.
Round-Tripping to Check Double Encoding
Double-encoding — where a value gets escaped twice and shows up as %2520 instead of %20 — is a classic bug. Decode a suspect string once with this tool; if the result still contains percent escapes, you have found the double encoding and can fix it at the source.
Tips and Best Practices
Use Component for Single Values
If you are escaping one piece of data — a parameter value, a path segment, a fragment — choose Component mode. encodeURIComponent escapes the structural characters too, which is exactly what you want when the value sits inside a larger URL.
Use URI for a Whole URL
If you have a complete URL that only needs its unsafe characters escaped while keeping the slashes and question mark intact, choose URI mode. encodeURI is designed for that case and will not mangle the URL's structure.
Watch for Decode Errors
decodeURIComponent throws on a malformed escape such as a lone percent sign. If the output suddenly goes blank or shows a decode error while decoding, check the input for an incomplete %xx sequence.
Swap to Verify a Round Trip
After encoding a value, click swap to decode it straight back. If you land on your original text, the round trip is clean; if not, the input likely contained something already encoded.
Compared to Alternatives
Plenty of generic online encoder sites such as urlencoder.org will percent-encode a string for you, but most of them send the text you paste to their server to process it. That is a real problem when the value is a token or a signed parameter. URL Shuttle runs encodeURIComponent, encodeURI, and decodeURIComponent locally with the functions your browser already ships, so sensitive text never leaves the page.
You can also encode in the browser console by calling encodeURIComponent yourself. That is accurate and private, but it means opening devtools and remembering which of the two functions you need. This tool puts the Component-versus-URI choice right in front of you and shows the result live, which removes both the friction and the guesswork.
Command-line tools and small scripts also keep data local, but they are heavyweight for a one-off escape and awkward on a machine where your environment is not set up. A browser-based encoder hits the sweet spot: the correct standard functions, full privacy, an instant preview, and zero setup on any device.
Frequently Asked Questions
What is URL encoding?
URL encoding, or percent-encoding, replaces characters that are reserved or unsafe in a URL with a percent sign and their hexadecimal byte value, so a space becomes %20. This tool uses the browser's built-in encodeURIComponent and encodeURI to produce the correct output.
What is the difference between Component and URI encoding?
Component mode uses encodeURIComponent and escapes nearly everything, making it right for a single value such as a query parameter. URI mode uses encodeURI and preserves structural characters like : / ? #, making it right for encoding a complete URL.
How does decoding work?
Decoding always uses decodeURIComponent, which turns percent escapes back into the original characters. %20 becomes a space and %40 becomes an at sign, no matter which mode produced the encoded string.
What if I decode an invalid string?
If the input has a malformed escape, such as a lone percent sign, decodeURIComponent throws. The tool catches that and clears or flags the output rather than showing broken text, so you know the input needs fixing.
Is my data safe?
Completely. Every operation runs in your browser and nothing you type is transmitted. You can decode tokens or signed parameters without any privacy concern.
Can I quickly reverse an operation?
Yes. The swap button moves the output into the input and flips between encode and decode, which makes it easy to round-trip a value and confirm it survives unchanged.
Need to escape more strings? Explore the full URL Shuttle toolkit.
Back to URL Shuttle