GrowthGPT
GrowthGPT
AI community platform for modern work

URL Encoder / Decoder

Encode, decode, and parse URLs with percent encoding. All processing happens in your browser.

Input

0 characters

encodeURIComponent()

Encodes all special characters including : / ? # @ and more. Use for query parameter values.

Start typing above to see live results.
0 characters

encodeURI()

Preserves URL-structural characters like : / ? # @. Use for encoding a full URL without breaking its structure.

Start typing above to see live results.

encodeURI() vs encodeURIComponent()

  • encodeURIComponent() encodes everything except A-Z a-z 0-9 - _ . ! ~ * ' ( ). Best for encoding individual query parameter keys and values.
  • encodeURI() leaves URL-structural characters intact: : / ? # [ ] @ ! $ & ' ( ) * + , ; =. Best for encoding an entire URL while keeping its structure valid.
  • Rule of thumb: use encodeURIComponent() for values, use encodeURI() for full URLs.

URL Parser

Paste a full URL to break it down into its components.

Stats

0
Input characters
0
Output characters
N/A
Size ratio

About this tool

  • Converts live as you type. No need to click a button.
  • All processing happens in your browser. No data is sent to any server.
  • Full UTF-8 support including emoji and non-Latin scripts.
  • Shows both encodeURI and encodeURIComponent results so you can pick the right one.

What Is Percent Encoding

Percent encoding (also called URL encoding) is a method for representing characters in a URI that are not allowed or have special meaning. Each unsafe character is replaced by a percent sign (%) followed by two hexadecimal digits representing the character's byte value. For example, a space becomes %20, an ampersand becomes %26, and a forward slash becomes %2F.

This encoding scheme is defined in RFC 3986 and ensures that URLs remain valid and unambiguous when transmitted over the internet. Without percent encoding, special characters in query strings, path segments, or fragment identifiers could be misinterpreted by browsers, servers, and APIs. This tool lets you encode and decode strings instantly using the same JavaScript functions available in every modern browser.

When to Use URL Encoding

URL encoding is essential any time you include user-generated or dynamic text inside a URL. The most common scenario is building query strings: if a search term contains spaces, ampersands, or equals signs, those characters must be percent-encoded so they are not confused with URL delimiters.

Other common use cases include encoding form data submitted via HTTP GET requests, constructing API calls with parameters that contain special characters, building redirect URLs that nest one URL inside another, and generating UTM-tagged links where campaign names might include spaces or punctuation. If you skip encoding, your URLs may break, return unexpected results, or introduce security vulnerabilities like open redirect exploits.

Common Percent-Encoded Characters

Here are the most frequently encoded characters and their percent-encoded equivalents:

Space becomes %20 (or + in form data). Ampersand (&) becomes %26. Equals sign (=) becomes %3D. Question mark (?) becomes %3F. Forward slash (/) becomes %2F. Hash/pound (#) becomes %23. At sign (@) becomes %40. Plus sign (+) becomes %2B. Percent sign (%) becomes %25.

Non-ASCII characters like accented letters and emoji are first converted to their UTF-8 byte sequences, and then each byte is percent-encoded individually. For example, the e-acute character becomes %C3%A9 (two bytes in UTF-8). This tool handles all of this automatically using the browser's built-in encoding functions.

encodeURI vs encodeURIComponent

JavaScript provides two built-in functions for URL encoding, and choosing the wrong one is a common source of bugs.

encodeURIComponent() encodes every character that is not an unreserved character (A-Z, a-z, 0-9, hyphen, underscore, period, tilde). This makes it ideal for encoding individual values like query parameter values, path segments, or any piece of text that will be embedded inside a URL.

encodeURI() is designed for encoding a complete URI. It leaves structural characters intact, including colon, forward slash, question mark, hash, at sign, ampersand, equals, plus, dollar, and comma. Use it when you have a full URL that may contain non-ASCII characters but whose structure (protocol, host, path, query) is already correct.

The rule of thumb: use encodeURIComponent for parts, use encodeURI for the whole thing. This tool shows both results side by side so you can compare and choose the right function for your use case.

Frequently Asked Questions

What is URL encoding?

URL encoding (percent encoding) replaces unsafe or reserved characters in a URL with a percent sign followed by two hexadecimal digits. For example, a space becomes %20 and an ampersand becomes %26. This ensures URLs are transmitted correctly across the internet without ambiguity.

What is the difference between encodeURI and encodeURIComponent?

encodeURI encodes a full URL while preserving structural characters like colons, slashes, and question marks. encodeURIComponent encodes everything except basic alphanumeric characters, making it suitable for encoding individual query parameter values. Use encodeURIComponent for parts of a URL and encodeURI for a complete URL.

Why is a space encoded as %20 instead of +?

The %20 encoding follows the URI standard (RFC 3986). The plus sign (+) for spaces is a legacy convention from HTML form submissions (application/x-www-form-urlencoded). Both are valid in query strings, but %20 is the universal standard used by encodeURIComponent and works correctly in all parts of a URL, not just query strings.

Does this tool send my data to a server?

No. All encoding, decoding, and URL parsing happens entirely in your browser using JavaScript. Nothing you type or paste is transmitted to any server, logged, or stored. The tool runs completely client-side.

Can I encode non-English characters and emoji?

Yes. This tool uses the browser's native encodeURIComponent and encodeURI functions, which fully support UTF-8. Non-ASCII characters like accented letters, CJK characters, and emoji are first converted to their UTF-8 byte sequences and then percent-encoded. For example, a thumbs-up emoji becomes a series of percent-encoded bytes.

Related Tools