Component versus whole-URL encoding
encodeURIComponent escapes &, =, ? and / — correct for parameter values. encodeURI leaves them alone — correct for a complete URL. Using the wrong one is a classic source of broken links.
DeveloperRuns in your browser
URL Encoder / Decoder
Percent-encode or decode URL components and full query strings.
- Input
- No upload needed — instant
- Privacy
- Nothing is uploaded
- Cost
- Free · no sign-up · no watermark
Loading tool…
The tool is loading its code on your device. This happens once and is cached for later visits.
Processed entirely on your device
Everything you type or paste is handled by JavaScript running in this tab. No request is sent, nothing is logged and nothing is stored. Close the page and it is gone.
Overview
About the URL Encoder / Decoder
Free URL encoder and decoder. Percent-encode query parameters, decode %XX sequences, parse full URLs into their parts and inspect query strings.
URLs are text, but they are text with a grammar. Characters that carry structural meaning — ? starts the query, & separates parameters, # starts the fragment, / separates path segments, % starts an escape — cannot appear literally inside a value without changing how the URL is parsed.
The reserved character problem
Consider a search for rock & roll. Naively assembled, ?q=rock & roll produces a query string with a parameter named q holding rock and a second malformed parameter. The ampersand has to become %26: ?q=rock%20%26%20roll.
This is what encoding is for, and it is why every URL-building helper in every framework does it for you. The bugs appear when you encode manually on top of an automatic encoder, or forget entirely.
Two different functions, two different jobs
encodeURI produces a valid URL from a string that is already shaped like one. It escapes the genuinely unsafe characters — spaces, quotes, non-ASCII — and leaves the structural ones intact.
encodeURIComponent produces a valid URL component. It escapes structural characters too, because inside a query value an ampersand is data, not structure.
The mistake is symmetric and common: using encodeURI on a parameter value lets & and = through and corrupts the query string; using encodeURIComponent on a whole URL escapes the :// and the path separators, producing something unrecognisable.
Decoding and the plus sign
In application/x-www-form-urlencoded — the format browsers use for form submissions — a space is encoded as +. In RFC 3986 percent-encoding, + is a literal plus and a space is %20. Both conventions appear in the wild, and a decoder has to know which it is dealing with.
The practical consequence: decoding a+b with form semantics gives a b; with strict percent semantics it gives a+b. This tool lets you choose, and defaults to form semantics for query strings because that is what almost all real traffic uses.
Inspecting a URL
Beyond encoding and decoding, the most useful thing this tool does is decompose. Paste a long marketing URL and you get the protocol, host, port, path, every query parameter decoded into readable values, and the fragment. That is the fastest way to understand what a tracking link is actually doing, and to spot a double-encoded value or a parameter that has been silently dropped.
Step by step
How to use the URL Encoder / Decoder
Choose Encode or Decode and paste your text or URL.
For encoding, select component mode (encodeURIComponent) or full-URL mode.
For decoding, paste the percent-encoded string — plus signs are handled per your setting.
Press Convert; if the input is a URL, its parts and query parameters are also listed.
Copy the result or any individual parameter value.
Why use it
Benefits and common use cases
What this tool is good for, and what it deliberately does not try to do.
URL parser built in
Paste any URL and see its protocol, host, path, hash and every query parameter broken out, decoded and ready to copy.
Plus-sign handling
application/x-www-form-urlencoded treats + as a space, while percent-encoding does not. A toggle selects which interpretation to apply when decoding.
Unicode-correct
Non-ASCII characters are encoded as their UTF-8 byte sequences, so accented text, CJK and emoji produce standards-compliant percent escapes.
Questions
Frequently asked questions
Short, honest answers about quality, limits and privacy.
What is percent-encoding?
Also called URL encoding, it replaces unsafe characters with % followed by two hexadecimal digits representing a byte. A space becomes %20, & becomes %26, and the euro sign becomes %E2%82%AC — its three UTF-8 bytes.
What is the difference between encodeURI and encodeURIComponent?
encodeURI assumes it is encoding a complete URL, so it leaves the reserved characters that give a URL its structure: : / ? # [ ] @ ! $ & ' ( ) * + , ; =. encodeURIComponent assumes it is encoding one component — a query value, a path segment — so it escapes all of those too. Encode parameter values with encodeURIComponent, never encodeURI.
Should a space be encoded as %20 or +?
In a query string submitted as a form (application/x-www-form-urlencoded), a space is a plus. Everywhere else in a URL, including the path, a space is %20. Decoders differ in strictness, so %20 is the safer choice — it is unambiguous in both contexts.
Which characters do not need encoding?
The unreserved set: A–Z, a–z, 0–9, hyphen, underscore, period and tilde. Everything else should be encoded when it appears in a component, though many characters are tolerated in practice by forgiving parsers.
Why does my decoded URL still contain %25?
It was double-encoded. %25 is the encoding of the percent character itself, so a string containing %2520 was encoded twice and needs two decode passes. Double encoding usually comes from encoding a value that was already encoded, often when a framework encodes automatically and your code encodes again.