What URL Encoding Is
URLs can only contain a limited set of characters: letters, digits, and a handful of symbols (-, ., _, ~). Anything else — spaces, accented letters, emoji, special characters like ? or & — has to be percent-encoded. A space becomes %20; the letter é becomes %C3%A9 (its UTF-8 bytes); a ? in the middle of a URL becomes %3F so the browser doesn't think the query string starts there.
The Microapp URL Encoder/Decoder lets you encode any string for safe inclusion in a URL, or decode an encoded URL back to readable text. Both directions, your browser, no server.
How to Use It
- Paste your string into the input box.
- The encoded version (or decoded, depending on direction) appears instantly in the output.
- Use the toggle to switch between encode and decode.
- Click "Copy" to put the result on your clipboard.
café au lait encoded as a URL component becomes:caf%C3%A9%20au%20laitEach byte of the UTF-8 representation of
é (C3 A9) gets percent-encoded; the spaces become %20. Decoded, it returns to the original.
encodeURI vs encodeURIComponent — The Subtle Difference
JavaScript exposes two URL-encoding functions, and choosing the wrong one is one of the most common bugs in URL-handling code:
encodeURI(url)— encodes a complete URL. Leaves reserved characters (/,?,#,&,=) alone because they have meaning in the URL structure.encodeURIComponent(part)— encodes a single component like a query string value. Encodes everything that's not a letter or digit, including/,?, etc., so the encoded value can be safely placed inside another URL.
The Microapp encoder uses encodeURIComponent by default — that's almost always what you want when constructing query string values. If you have a full URL with structure you want to preserve, decode it with the URL decoder instead and inspect the parts.
| Input | encodeURI | encodeURIComponent |
|---|---|---|
https://example.com/path?q=hello world | https://example.com/path?q=hello%20world | https%3A%2F%2Fexample.com%2Fpath%3Fq%3Dhello%20world |
q=value&flag=true | q=value&flag=true (& kept) | q%3Dvalue%26flag%3Dtrue (& encoded) |
What URL Encoding Is For
Building query strings programmatically. When you assemble a URL like /search?q=USER_INPUT, the user input might contain &, =, or other characters that would break the query string. Encoding the value protects the URL structure.
Encoding non-ASCII URLs. The URL spec only allows ASCII characters; international URLs with Cyrillic, Arabic, or Asian characters must be percent-encoded for transmission (browsers display the decoded form for readability).
Form submissions. Forms with method="GET" automatically URL-encode their values when assembling the query string. Knowing what's happening is useful for debugging.
OAuth / API tokens. Tokens often contain + or / characters that need encoding before they appear in URLs.
Common Bugs This Tool Catches
Double-encoding. Calling encodeURIComponent on an already-encoded string produces a doubly-encoded mess (%2520 instead of %20 for a space). Decode first to spot it; if the decoded string still has percent signs, it's been encoded twice.
Mixing UTF-8 and Latin-1. Older systems sometimes encode using Latin-1 instead of UTF-8, producing different byte sequences for accented characters. Modern web standards mandate UTF-8 — if the decoded text shows mojibake (garbled accents), the source used the wrong encoding.
Plus-vs-space confusion. Form submissions encode spaces as + instead of %20. Most decoders handle both, but URL decoding strictly should treat + as a literal plus sign in the path component (it only means space inside query strings). The Microapp decoder handles both contexts.
Related Tools
For encoding HTML special characters (<, >, &) as entities, use the HTML Encoder/Decoder — different problem, different rules. To encode arbitrary binary data for safe transmission, the Base64 Encoder/Decoder is the right choice. To convert a long URL into a clean URL slug, see the Slug Generator.