You Might Also Like
URL Encoder & Decoder Online — Percent-Encode & Decode URLs Free
About this tool
What Is URL Encoding and How Does This Tool Help?
URL encoding, formally defined as percent-encoding in RFC 3986, is the mechanism by which characters that are not allowed in URLs — or that have special structural meaning — are replaced with a safe representation: a percent sign followed by two uppercase hexadecimal digits representing the UTF-8 byte value of the character. For example, a space (ASCII 32, hex 0x20) becomes %20, an ampersand (hex 0x26) becomes %26, and a non-ASCII character like the euro sign € (UTF-8 bytes 0xE2, 0x82, 0xAC) becomes %E2%82%AC. Only letters (A–Z, a–z), digits (0–9), and the four unreserved characters - _ . ~ are always safe in URLs and never need encoding. Every other character — including spaces, punctuation, and all characters outside the ASCII range — must be percent-encoded before being included in a URL.
This free online URL encoder and decoder handles both encoding and decoding in a single interface, with live output that updates as you type and visual highlighting that shows you exactly which characters were changed. The encoder supports two JavaScript encoding functions with different scopes: encodeURIComponent encodes every character except letters, digits, and - _ . ! ~ * ' ( ) — this is the correct function for encoding individual query parameter values and path segments, where characters like / : ? & = # should be treated as literal data rather than URL syntax. encodeURI preserves URL structural characters (/ : ? & # = @ + and others) — this is the correct function for encoding a complete URL where you want the structure to remain intact.
Understanding when to use each encoding function is one of the most common sources of URL bugs in web development. Consider a redirect URL passed as a query parameter: redirect=/dashboard?user=123&token=abc. If this is included in a URL without encoding, the outer URL parser will see two ampersands and think the redirect parameter ends at the first &. Using encodeURIComponent on the redirect value encodes the / ? & = characters as %2F %3F %26 %3D, making the entire redirect URL a single safe query parameter value that the server can decode correctly. This tool makes that distinction concrete — switch between Query String (encodeURIComponent) and Full URL (encodeURI) modes to see exactly which characters each function encodes differently.
URL decoding (percent-decoding) is the inverse operation: every %XX sequence is replaced with the character it represents. This is essential for reading logged URLs, debugging redirect chains, inspecting API request parameters, and understanding encoded webhook payloads. The decoder supports the full UTF-8 multi-byte sequence encoding used for international characters — pasting %E2%82%AC decodes to €, and %C3%A9 decodes to é. Malformed sequences (incomplete or invalid %XX codes) are shown with a clear error rather than silently producing garbage output.
Features
- Live URL encoding and decoding — output updates instantly as you type with no button click needed
- Query String mode using encodeURIComponent — encodes all URL-reserved characters including / : ? & # = +
- Full URL mode using encodeURI — preserves URL structure characters while encoding unsafe characters
- Highlighted %XX sequences in encoded output — cyan highlights show exactly which characters were encoded
- Highlighted percent sequences in decode input — see which sequences will be decoded before conversion
- Swap button — flip output back to input and switch encode/decode mode automatically in one click
- Stats bar — count of encoded or decoded sequences and byte size change between input and output
- 100% client-side — uses native browser JavaScript (encodeURIComponent, decodeURIComponent), nothing uploaded
How to Use
Select Encode or Decode mode using the toggle at the top of the tool.
In Encode mode, paste any text, URL, or query string value into the left pane. The percent-encoded output appears immediately on the right, with each encoded sequence highlighted in cyan so you can see exactly which characters were converted. Choose Query String mode (encodeURIComponent) when encoding individual query parameter values — this encodes everything including : / ? & = # which would otherwise be interpreted as URL delimiters. Choose Full URL mode (encodeURI) when encoding a complete URL where you want the structural characters to remain — useful for encoding a URL that contains spaces or non-ASCII characters without breaking its query string or path structure.
In Decode mode, paste any percent-encoded URL, query string, or text into the left pane. The decoded output appears on the right with the original %XX sequences in the input highlighted in cyan so you can see what was encoded. The decoder handles all standard ASCII percent-encoding and multi-byte UTF-8 sequences for international characters, emoji, and special symbols. If the input contains malformed sequences (e.g., a lone % not followed by two hex digits), a clear error message is shown.
The stats bar below the output pane shows the number of sequences that were encoded or decoded and the byte size change between input and output. This is useful for understanding the overhead that percent-encoding adds to URL length — important when working with URL length limits in browsers and servers.
Click the ⇄ swap button to instantly move the output back to the input and switch between Encode and Decode mode — useful for round-trip verification (encode something, then decode the result to confirm you get the original back). Click Copy to copy the output to your clipboard. The output area can also be selected and copied manually for partial copies.
Common workflows: For encoding a search query before appending to a URL in JavaScript — paste the search term, use Query String mode, copy the %XX result, and use it in your URL construction. For debugging a logged URL with encoded characters — switch to Decode, paste the URL, and read the human-friendly decoded version. For building API request parameters — encode each value with Query String mode and manually assemble the key=value&key=value string.
Common Use Cases
Frequently Asked Questions
URL encoding replaces characters that are not safe or not meaningful in URLs with a percent sign followed by two hexadecimal digits representing the character's UTF-8 byte value. URLs can only contain a specific set of safe characters — letters, digits, and a few punctuation marks. Characters outside this set (spaces, &, =, /, ?, #, and all non-ASCII characters) must be encoded. This ensures URLs are transmitted correctly across all HTTP clients, servers, proxies, and browsers without the characters being misinterpreted as URL structural syntax.
encodeURIComponent encodes all characters except letters, digits, and - _ . ! ~ * ' ( ) — including the URL structural characters : / ? & # = + @. Use it for encoding individual query parameter values and path segments where those characters should be treated as literal data. encodeURI preserves URL structural characters (/ : ? & # = + @ and others) so the URL structure remains intact. Use it for encoding a complete URL that contains unsafe characters like spaces or accented letters but should keep its query string and path structure unchanged. When in doubt, use encodeURIComponent — it is the safer choice for values.
Letters (A–Z and a–z), digits (0–9), and the four unreserved characters defined in RFC 3986 — hyphen (-), underscore (_), period (.), and tilde (~) — are always safe in URLs and never need percent-encoding. Everything else — including spaces, &, =, +, /, ?, #, colons, brackets, non-ASCII characters, and emoji — must be percent-encoded when included in a URL.
Both %20 and + represent a space, but in different encoding formats. %20 is standard RFC 3986 percent-encoding and is correct in all URL contexts. The + sign represents a space only in application/x-www-form-urlencoded format — the encoding used when an HTML form is submitted with method="POST" and the default Content-Type. JavaScript's encodeURIComponent always produces %20 for spaces. If you see + in a URL query string, it typically came from an HTML form submission, not from encodeURIComponent.
Switch to Decode mode in this tool and paste the percent-encoded URL or string. The decoded text appears instantly on the right. The decoder handles all standard ASCII percent-sequences (%20, %26, %3D, etc.) and multi-byte UTF-8 sequences for international characters (%C3%A9 for é, %E2%82%AC for €). Malformed or incomplete sequences show a clear error message rather than corrupting the output.
No. URL encoding (percent-encoding) replaces unsafe characters with %XX codes for safe transmission in URLs. HTML encoding (HTML entity encoding) replaces characters that have special meaning in HTML with entity references — & for &, < for <, > for >, " for ". They solve different problems: URL encoding makes text safe in URLs, HTML encoding makes text safe for rendering in HTML. Never confuse the two — applying HTML encoding to a URL, or vice versa, will corrupt the data.
No. URL encoding replaces individual unsafe characters with %XX sequences — the output looks similar to the original input with some characters escaped. Base64 encoding converts all bytes into 64 printable ASCII characters — the output looks completely different from the input (e.g. "hello" becomes "aGVsbG8="). Base64 is used to embed binary data in text channels. URL encoding is used to make text safe for use in URLs. They are not interchangeable.
Yes — 100% private. Encoding and decoding use the browser's native JavaScript functions (encodeURIComponent, encodeURI, decodeURIComponent). Nothing is sent to any server. The tool works fully offline once the page has loaded. Safe to use with sensitive URL parameters, authentication tokens, redirect URLs, and any other data you would not want to share with a third-party service.