URL encoding explained: percent signs, %20 and when to use the URL Encoder
AdvertisementYou paste a link into a chat and it arrives as https://example.com/search?q=hello%20world. Nobody typed those percent signs. They were added because a web address can only contain a small set of safe characters, and a space is not one of them. This is URL encoding, also called percent-encoding, and it sits behind every search box, every form and every API call. Getting it wrong produces broken links, missing parameters and bugs that only appear when a user types an ampersand or an accented letter. The free URL Encoder & Decoder converts text in both directions in your browser. This guide explains the rules so that you know what the tool is doing and when to use each option.
What percent-encoding is
A URL is made of parts that have a job: https is the scheme, example.com the host, /search the path, ?q=hello the query and #top a fragment. Certain characters are reserved because they separate those parts: : / ? # & = + and a few more. Other characters, such as spaces, quotes, < and >, and every letter outside plain English, are not allowed at all.
When such a character has to appear as ordinary data, it is replaced by a percent sign followed by two hexadecimal digits that give its byte value. A space is byte 32, which is 20 in hexadecimal, so it becomes %20. An ampersand is byte 38, so it becomes %26. Letters outside ASCII are first converted to bytes using UTF-8, and each byte is encoded separately, which is why one accented letter turns into two sequences and one Japanese character into three.
| Text | Encoded |
|---|---|
a b&c=d |
a%20b%26c%3Dd |
café & crème |
caf%C3%A9%20%26%20cr%C3%A8me |
100% sure/yes? |
100%25%20sure%2Fyes%3F |
日本 |
%E6%97%A5%E6%9C%AC |
The third line shows an important detail: a literal percent sign must itself be encoded, as %25, otherwise a decoder would read the next characters as a code.
Why it matters
Consider a search page that builds its address by joining strings: /search?q= plus whatever the user typed. If the user searches for fish & chips, the address becomes /search?q=fish & chips. The server sees q=fish and then a second parameter called chips. The search runs for the wrong thing and nothing warns you. Encoding the value first gives q=fish%20%26%20chips, which the server decodes back to exactly what was typed.
The same problem appears in many places: redirect addresses passed as a parameter, return links in login flows, file names with spaces in download links, and API requests with filter values. Whenever user-provided or variable text goes into a URL, it needs encoding.
Component or full URL
The tool has two scopes, and choosing the right one is the most important decision.
Component encodes everything except letters, digits and a few punctuation marks (- _ . ! ~ * ' ( )). That includes /, ?, &, =, : and #. Use it for a single value: one query parameter, one path segment, one piece of data. In JavaScript this is encodeURIComponent.
Full URL leaves the structural characters alone and encodes only what is unsafe. Use it for an entire address that is already built, where you only want to make spaces and non-English letters safe. In JavaScript this is encodeURI.
The difference is easy to see on one input:
| Input | Component result | Full URL result |
|---|---|---|
https://example.com/a b |
https%3A%2F%2Fexample.com%2Fa%20b |
https://example.com/a%20b |
https://example.com/search?q=hello world&lang=en |
everything encoded, unusable as a link | https://example.com/search?q=hello%20world&lang=en |
If you encode a whole address as a component, the result is no longer a link, because the slashes and colon are gone. If you encode a value as a full URL, an & inside it will not be escaped and will split the parameter. A good rule: encode each value as a component, then join the parts with the structural characters yourself.
Using the tool
- Open the URL Encoder & Decoder.
- Choose Encode to make text safe, or Decode to turn an encoded string back into readable text.
- Choose Component for a value or Full URL for an address.
- Paste your text. The result updates as you type, and the Copy button puts it on your clipboard.
Everything happens in your browser, so an address containing a token or a private file name is not sent anywhere.
Typical uses:
- Preparing a query value. Encode the search words, then add them after
?q=. - Reading a messy link. A long tracking address full of
%3Dand%26becomes understandable after decoding. - Checking a redirect parameter. Decode the value of
?next=to see where a login would send the user. - Debugging a failing API call. Compare the encoded value you send with what the server logged.
- Making a file link work. A download named
Sales Report 2026.pdfneedsSales%20Report%202026.pdf.
The plus sign problem
In the query part of a URL, an older convention used by HTML forms writes a space as +. So q=hello+world and q=hello%20world both mean "hello world" to most servers. But a plus sign in the path is just a plus, and a real plus that you want to send in a query value must be written as %2B. This causes a famous bug: someone sends a+b to mean the text "a+b", and the server reads "a b".
The tool uses the JavaScript functions, which write spaces as %20 and encode a real plus as %2B. When you decode, it leaves + as a plus. If you are decoding a form-submitted query string, replace the plus signs with spaces yourself first.
Double encoding
The most common encoding bug is encoding twice. After the first pass, hello world is hello%20world. Encode that again and the percent sign becomes %25, giving hello%2520world. The server decodes once and receives hello%20world as literal text, so the user sees percent codes on the page.
Signs of double encoding are %25 followed by two digits, and visible %20 in displayed text. To fix it, decode once and look at the result. Prevent it by encoding at exactly one point: when the URL is built, not in several layers that each "play safe". Many libraries and frameworks encode for you when you pass parameters as an array or object, so check before adding your own encoding.
Decoding errors
Decoding fails when the text contains a percent sign that is not followed by two hexadecimal digits, such as 100% at the end of a string or 50% off. The decoder reports a malformed sequence instead of guessing. The cause is nearly always text that was never encoded in the first place, or that was cut off in the middle of a sequence. Encode the raw text first, or fix the truncated value.
A related problem appears with text that was encoded using a different character set from UTF-8. Modern systems use UTF-8, but some old pages used Latin-1, where one accented letter is a single byte. Decoding those as UTF-8 yields an error or strange symbols.
Where this appears in programming
Every language has built-in functions for this: encodeURIComponent in JavaScript, urlencode and rawurlencode in PHP, quote in Python's urllib.parse. In PHP, urlencode writes spaces as + while rawurlencode writes %20, which follows the stricter rule for paths. Learn how PHP builds links from user input in Forms: GET and POST and the security implications in Web security. In plain HTML, the links lesson shows how addresses are written, and the forms lesson explains how a browser encodes form data automatically when it submits a GET form.
For security, also remember that encoding is not protection. It makes characters safe to carry inside a URL, but the receiving code must still validate and escape the value for wherever it is used next, such as an HTML page or a database query.
Related tools
If a link needs to be shared as a picture or printed on a poster, turn it into a scannable code with the QR Code Generator. To encode text as Base64 or compute a hash, use the Hash & Encode Toolkit. When you convert a title into a web address slug, the Case Converter can produce the kebab-case form.
Quick answers
Why does a space become %20? A space has the byte value 32, which is 20 in hexadecimal, and the percent sign marks an encoded byte.
Is %20 the same as +? Only in the query part of a URL written by an HTML form. In a path, + is a literal plus sign.
Can I encode a whole URL as a component? You can, but the result is no longer a working link. Use the component option for values, and the full-URL option for finished addresses.
Does encoding hide or protect my data? No. Anyone can decode a percent-encoded string. It only makes the characters safe to transmit.
Do I need to encode letters like é? Yes, in strict URLs. Browsers often show the readable form in the address bar but send the encoded one.