CodeKitHub
Encode Tools

URL Encoder / Decoder Online

Last updated:

Percent-encode text for safe use in URLs, or decode an encoded URL back to readable form. Choose component mode (encodes everything, for query parameter values) or full-URL mode (keeps :// ? & structure intact). Runs entirely in your browser.

What Is This Tool?

URL encoding (percent encoding) replaces characters that aren't allowed in URLs with a % followed by their byte value in hex — a space becomes %20, and 你 becomes %E4%BD%A0. Without it, characters like spaces, &, ? and non-ASCII text would break the URL structure or get misinterpreted by servers.

There are two common needs, and this tool supports both: encoding a value that goes inside a query parameter (component mode — encodes / ? & = too), and encoding a whole URL while keeping its structure (full-URL mode — leaves :// ? & intact).

One historical quirk worth knowing: a space is properly %20 under the URL standard (RFC 3986), but HTML form submissions have traditionally encoded it as a plus sign instead — which is why you see both q=hello%20world and q=hello+world in the wild, and why decoding form data sometimes needs the + handled separately.

Why Use It?

  • Build query strings safely — user input with &, = or spaces won't break your URL.
  • Decode long encoded URLs from logs, analytics or redirect chains to see what they actually say.
  • Correct UTF-8 handling for Chinese, emoji and other non-ASCII text.
  • Two modes so you don't accidentally encode the : and / of an entire URL.
  • Free, instant, no upload.

How to Use

  1. Paste your text or URL into the input box.
  2. Pick the mode: "Component" for values going into query parameters, "Full URL" for entire URLs.
  3. Click "Encode" or "Decode".
  4. Copy the result.

Example

Input

https://example.com/search?q=hello world & 你好

Output

Component mode: https%3A%2F%2Fexample.com%2Fsearch%3Fq%3Dhello%20world%20%26%20%E4%BD%A0%E5%A5%BD
Full URL mode:  https://example.com/search?q=hello%20world%20&%20%E4%BD%A0%E5%A5%BD

Component mode encodes structure characters too; full-URL mode preserves them.

Common use cases

  • Building a shareable URL where a search term or filter value comes from user input and might contain spaces, &, or other special characters.
  • Decoding a long tracking or redirect URL from an email or ad campaign to see the actual destination and parameters before clicking it.
  • Debugging why a query parameter isn't being read correctly by a server — often the culprit is a reserved character that should have been encoded but wasn't.
  • Preparing a non-English (Chinese, Japanese, Arabic, etc.) value for use in a URL query string.

encodeURIComponent vs encodeURI, in practice

These map directly to this tool's two modes and correspond to real JavaScript functions developers already know: encodeURIComponent (component mode) encodes everything except a small set of unreserved characters, making it safe for any single value being inserted into a URL — this is what you use for a query parameter, a path segment, or a hash fragment value. encodeURI (full-URL mode) leaves the URL's structural characters (:, /, ?, #, &, =) untouched because it assumes you're encoding an entire, already-structured URL, not a raw value — using it on a single parameter value would fail to encode the & or = characters that value might contain, which is the most common mistake people make when picking the wrong mode.

Reserved vs unreserved characters

The URL spec (RFC 3986) divides characters into two groups: unreserved characters (letters, digits, - _ . ~) are always safe and never encoded, while reserved characters (: / ? # [ ] @ ! $ & ' ( ) * + , ; =) have special meaning in URL structure and only need encoding when they appear as literal data rather than structural punctuation. This is exactly why the two modes exist — component mode treats reserved characters as data to protect, full-URL mode treats them as structure to preserve. Understanding this distinction is more useful than memorizing when to use which mode, since it explains why the same character (like &) is sometimes encoded and sometimes left alone depending on what role it's playing in the specific URL.

Frequently Asked Questions

When should I use component mode vs full URL mode?

Component mode (encodeURIComponent) when encoding a single value that goes inside a query parameter — it encodes /, ?, & and = so they can't break the URL. Full URL mode (encodeURI) when encoding a complete URL — it keeps the structural characters so the URL still works.

Why did %20 appear instead of + for spaces?

Both are valid in different contexts. %20 is the universal percent-encoding for a space; + means space only inside query strings using the older application/x-www-form-urlencoded format. This tool uses %20, which works everywhere.

Why does decoding fail with an error?

The input contains a malformed percent sequence, like a % not followed by two hex digits. This often happens when a URL was cut off or double-decoded. Fix or remove the broken % sequence.

What is double encoding?

Encoding already-encoded text: %20 becomes %2520 because % itself is encoded to %25. It's a common bug — if your decoded output still contains % codes, decode it once more.

Does this handle Chinese characters and emoji?

Yes. Text is encoded as UTF-8 bytes, so 你好 becomes %E4%BD%A0%E5%A5%BD and decodes back perfectly — the same behavior browsers use.

Related Tools