Coding Tool

URL Encoder / Decoder

Encode or decode URLs and query strings instantly — supports full URL, component, and form-data encoding modes.

Common Percent-Encoded Characters

Quick reference for the characters you'll encounter most often in encoded URLs.

Spaces & Punctuation
%20
Space (or + in form data)
%21
! exclamation mark
%22
" double quote
%23
# number sign
%25
% percent sign
%26
& ampersand
%27
' apostrophe
URL Structure Characters
%2F
/ forward slash
%3A
: colon
%3D
= equals sign
%3F
? question mark
%40
@ at sign
%5B
[ left bracket
%5D
] right bracket
Special Characters
%28
( left parenthesis
%29
) right parenthesis
%2B
+ plus sign
%2C
, comma
%3C
< less-than
%3E
> greater-than
%7C
| vertical bar
Encoding Mode Guide
encodeURIComponent — Use for query parameter values, hash fragments, or any single component. Encodes everything except: A–Z a–z 0–9 - _ . ! ~ * ' ( )
encodeURI — Use for a complete URL. Leaves /, ?, #, &, =, : and other structural characters intact.
Form data (+) — Used by HTML forms (application/x-www-form-urlencoded). Spaces become + instead of %20.

How to Use This Tool

Three ways to encode, decode, and inspect URLs.

1
Choose Encode or Decode
Click Encode to convert plain text to a percent-encoded URL. Click Decode to convert an encoded URL back to readable text.
2
Pick an Encoding Mode
Use encodeURIComponent for parameter values, encodeURI for a full URL, or Form data for HTML form submissions (spaces become +).
3
Paste Your Input
Paste a URL or text into the input field. The result appears instantly in the output box below.
4
Swap Input and Output
Click the Swap button to move the output back to the input — useful when you want to re-encode a decoded URL or vice versa.
5
Parse a Query String
Switch to Parse Query String mode and paste a full URL to see all query parameters decoded side by side in a table.
6
Copy the Result
Click Copy to copy the encoded or decoded output to your clipboard, ready to paste into your code or browser.

How URL Encoding Works

The JavaScript functions and RFC 3986 rules behind this tool.

🔤
Percent Encoding
Each unsafe character is replaced with % followed by its two-digit hexadecimal UTF-8 byte value. Space → %20, © → %C2%A9.
🔗
encodeURI
Uses JavaScript's built-in encodeURI(). Encodes all characters except unreserved and reserved URI characters per RFC 3986.
🧩
encodeURIComponent
Uses encodeURIComponent(). Encodes all characters except unreserved characters (A–Z, a–z, 0–9, -, _, ., ~, !, ', (, ), *).
📋
Form Encoding
HTML forms use application/x-www-form-urlencoded. Spaces become + (not %20) and + characters become %2B.
🔍
Query Parsing
Uses URLSearchParams to parse query strings. Handles both %20 and + space encoding, repeated keys, and empty values.
🔒
100% Private
All encoding and decoding runs in your browser using native JavaScript APIs. Your URLs and data never leave your device.

Frequently Asked Questions

Common questions about URL encoding.

RFC 3986 defines "unreserved characters" that are always safe: A–Z a–z 0–9 - _ . ~. These never need to be encoded. "Reserved characters" like / ? # [ ] @ ! $ & ' ( ) * + , ; = have special meaning in URLs and should be encoded when used as data rather than structure. All other characters (spaces, Unicode, etc.) must always be percent-encoded.

Use encodeURI when you have a complete URL and want to make it safe for transmission without breaking its structure (/ and ? stay as-is). Use encodeURIComponent when encoding a single piece of data that will be inserted into a URL — like a query parameter value, a path segment, or a hash fragment. In practice, you'll use encodeURIComponent far more often in JavaScript code.

Both represent a space, but they come from different encoding conventions. %20 is the RFC 3986 standard percent-encoding of a space. The + sign for spaces comes from HTML form encoding (application/x-www-form-urlencoded), which was designed before RFC 3986. When your browser submits a form, it uses + for spaces. When JavaScript uses encodeURIComponent, it uses %20. Both are decoded correctly by most servers, but %20 is safer to use in all contexts.

Yes. Non-ASCII characters are first encoded to UTF-8 bytes, then each byte is percent-encoded. A Chinese character like 中 encodes to %E4%B8%AD (3 bytes). An emoji like 😀 encodes to %F0%9F%98%80 (4 bytes). Modern browsers handle international characters in URLs via internationalized domain names (IDN) and percent-encoding. The tool handles all of these correctly using JavaScript's built-in encoding functions.

This happens when the encoded string uses a non-UTF-8 encoding (like Latin-1 or Windows-1252). JavaScript's decodeURIComponent assumes UTF-8. If the original encoding used a different character set, decoding in a UTF-8 context produces incorrect characters. It can also happen with malformed percent sequences — like %GG (invalid hex digits) or incomplete multi-byte sequences. The tool shows an error when decoding fails due to malformed input.

In most cases, you should only encode the individual parameter values (and sometimes keys), not the whole URL. If you encode the entire URL with encodeURIComponent, you'll turn the ://, ?, and & into their percent-encoded forms, making it an invalid URL. The correct approach: build the URL's base and path normally, then encode only the dynamic values you insert into query parameters using encodeURIComponent.


Related Coding Tools

View all →

Related Articles

View all →