URL encoding: what %20 means and when to encode
See what each percent code stands for, when to encode a single value or a whole URL, and how double encoding quietly breaks links.
%20 in a URL is a space. Percent-encoding replaces every character that can't appear as-is in a URL with a % followed by two hexadecimal digits, so the link reaches the server intact. The URL encoder converts text to its encoded form and back in your browser, with a choice between encoding a component or a full URL, and that choice is behind most of the bugs.
Why encode at all?
A URL only allows a limited set of ASCII characters, and several have a job: ? starts the query string, & separates parameters, = joins a name to a value, # starts a fragment and / separates path segments. If your data contains any of them, you encode it so it isn't mistaken for structure. The rules live in RFC 3986.
Take price=10&20: a browser reads two parameters, price=10 and 20. Encoded as price=10%2620, it's one value: 10&20.
How is each character encoded?
Spaces, accented letters and symbols become the bytes of their UTF-8 form, written in hexadecimal with a % in front. These are real outputs from the tool:
| Character | Encoded | Note |
|---|---|---|
| space | %20 | The most common |
& | %26 | Separates parameters if left raw |
= | %3D | Joins name and value |
? | %3F | Starts the query string |
# | %23 | Starts the fragment |
/ | %2F | Separates path segments |
+ | %2B | In form data, a raw + reads as a space |
é | %C3%A9 | Two bytes in UTF-8 |
ñ | %C3%B1 | Two bytes in UTF-8 |
% | %25 | The percent sign itself is encoded too |
Component vs full URL, the choice that matters
The tool has two modes, matching two JavaScript functions:
- Component (
encodeURIComponent): encodes every special character. Use it for a single value, such as what someone typed into a search box. - Full URL (
encodeURI): preserves:,/,?,#,&and=, because they structure the URL. Use it for an assembled URL that only has spaces or accents.
For instance, https://ex.com/a b?q=ñ&x=1#h becomes https://ex.com/a%20b?q=%C3%B1&x=1#h in full-URL mode and keeps its structure. In Component mode the colons and slashes would be encoded too (https%3A%2F%2F...) and the link would stop being a URL.
Step by step in the tool
- Open the URL encoder and choose Encode or Decode.
- Pick the scope: Component or Full URL.
- Type or paste the text. The result appears right away.
- Copy it, or download it as a
.txt.
Reading a URL full of percent signs
Decoding is as handy as encoding. Take https://example.com/search?q=caf%C3%A9%20au%20lait&page=2. Decoded in full-URL mode it reads https://example.com/search?q=café au lait&page=2: the search term is "café au lait" and there's a second parameter, page=2. It's a quick way to see what a tracking link carries or to confirm a value wasn't altered along the way. If a value contains %26, split the parameters before decoding: decode first and that & goes back to looking like a separator.
Errors that keep coming back
- Double encoding. Encode something already encoded and
%20turns into%2520, because the%becomes%25. The link breaks and a stray2520appears. Decode once and trace which step encodes twice. - Wrong mode. Encoding a full URL in Component mode makes it unusable.
- Malformed URI. When decoding, a
%that isn't followed by two hex digits, such as a bare100%, makes the tool report a malformed URI. Encode that sign as%25. +vs%20. In web form data a+means a space, but in a URL path it doesn't. When unsure,%20is understood in more places.
Doing it in code
The two tool modes mirror the functions every JavaScript runtime ships. encodeURIComponent("café au lait") returns caf%C3%A9%20au%20lait, and decodeURIComponent reverses it. Other languages have equivalents in their standard libraries, so if you find yourself building query strings by hand with string concatenation, switch to your language's URL or query-string builder and let it do the encoding. The tool is for checking what your code should produce, not for replacing it.
Where it earns its keep
Building links with parameters that carry free text, reading a URL full of % to see what it says, and debugging a broken link. If the value you're encoding is a campaign parameter, see UTM parameters: the mistakes that ruin your analytics, and for the other encoding people mix this up with, what is Base64.
Frequently asked questions
What does %20 mean in a URL?
It's a space. Percent-encoding writes a character as % plus its hexadecimal value, and the space has the value 20.
What's the difference between encodeURI and encodeURIComponent?
encodeURI keeps the characters that structure a URL (: / ? # & =) and suits a complete URL. encodeURIComponent encodes all special characters and suits a single value, such as a parameter.
How is an accented letter encoded in a URL?
As its UTF-8 bytes in hexadecimal: é is %C3%A9 and ñ is %C3%B1.
Why do I see %2520 in my link?
It was encoded twice: the % of %20 became %25. Decode once and check the step that encodes too much.
What is a malformed URI?
Text with a % that isn't followed by two valid hexadecimal digits, like an unencoded 100%. Fix it by writing that sign as %25.
Is my text sent to a server?
No. The conversion happens in your browser.
Encode or decode a URL
Pick a component or a full URL and see the result instantly. Runs locally, free, no signup.
Open URL Encoder →Related tools
- URL Encoder: encode and decode, as a component or a full URL.
- UTM Builder: assemble campaign links with properly encoded parameters.
- Base64: another common encoding, with a different purpose.
- HTML Entities: escape characters for use inside HTML.
You might also like: what is a URL slug and how to write good ones, hreflang mistakes that break international SEO, HTML entities and XSS: what to escape and where and Regex examples you can test: email, URL, IP.