Encode/decode URL-formatted strings

Encode text to URL-encoded format (also known as "percent-encoded"), or decode from it.

Enable JavaScript to use the interactive tool. The guide below explains how it works.

URL Encoder & Decoder: Mastering Percent-Encoding

In the early days of the web, URLs were designed to be simple and composed of a limited set of characters. As the internet evolved into a global platform supporting thousands of languages and complex data structures, a system was needed to represent non-standard characters within the strict confines of a URL. This system is known as Percent-Encoding, and the URL Encoder & Decoder is the essential tool for managing it.

1. What the Tool Does

The URL Encoder transforms "unsafe" characters into a format that can be safely transmitted over the internet. Conversely, the Decoder takes these encoded strings and returns them to their original, human-readable form.

The Mechanism of Percent-Encoding

When a character is encoded, it is replaced by a % followed by the two-digit hexadecimal representation of its ASCII (or UTF-8) value. For example:

• A space character has an ASCII value of 32, which is 20 in hex. Thus, a space becomes %20.
• An exclamation mark ! becomes %21.

The tool handles:

• Encoding: Converting plain text into a URL-safe string.
• Decoding: Converting percent-encoded strings back into plain text.
• Support for UTF-8: Modern encoding tools (like this one) support multi-byte characters, meaning you can safely encode emojis (like 🚀 becoming %F0%9F%9A%80) and non-Latin scripts (like Kanji or Cyrillic).

2. Why Someone Uses It

URLs have a specific "grammar." Certain characters are reserved for structural purposes (like / for paths, ? for queries, and # for fragments). If your data contains these characters, you must encode them to avoid confusing the browser or the server.

Passing Data in Query Parameters

If you want to send a search query like "Coffee & Tea" via a URL, you can't just write ?q=Coffee & Tea. The server would see the & and think it's the start of a new parameter. By encoding it to ?q=Coffee%20%26%20Tea, you ensure the server receives the literal string "Coffee & Tea".

Handling Multilingual Content

If your website supports international users, their names or locations might contain accented characters (like é or ü). These are not part of the standard ASCII set allowed in URLs. Encoding ensures that these characters are preserved correctly as they travel across the network.

Web Scraping and Automation

When writing scripts to interact with websites, you often have to construct URLs programmatically. If you don't encode your inputs, your scripts will likely fail as soon as they encounter a special character or a space.

3. Step-by-Step Instructions

1. Select Your Mode: Choose whether you want to Encode or Decode.
2. Input Your Text: Paste the text you want to process into the input area.
3. Review the Output: The tool will provide the result in real-time.
4. Special Options:
   • Encode All Characters: Usually, standard characters like a-z and 0-9 aren't encoded. Some use cases require encoding every single character for maximum safety or obfuscation.
   • Decode Mode: If you have a messy URL you found in a log file, paste it in "Decode" mode to see what the original values were.
5. Copy and Use: Click the copy button to take the result and use it in your code, browser address bar, or documentation.

4. Examples

Basic Special Characters

• Input: Hello World!
• Encoded: Hello%20World%21

Structural Conflict

• Input: id=100&name=John (as a single value)
• Encoded: id%3D100%26name%3DJohn
• Resulting URL: https://example.com/api?data=id%3D100%26name%3DJohn (The server now knows data contains the whole string, rather than thinking name is a separate parameter).

Emojis and International Text

• Input: Café ☕
• Encoded: Caf%C3%A9%20%E2%98%95

5. FAQs

What is the difference between encodeURI and encodeURIComponent?

In JavaScript programming:

• encodeURI is meant for a full URL. It does not encode structural characters like :, /, ;, and ?.
• encodeURIComponent is meant for a single piece of data (like a query value). It does encode almost everything, including structural characters. Our tool generally follows the more comprehensive encodeURIComponent logic to ensure maximum safety for your data.

Should I encode the whole URL?

No. If you encode the https:// part, it becomes https%3A%2F%2F, and your browser won't know how to open it. You should only encode the parts of the URL that contain user-generated data or special characters (usually the path or the query values).

Is URL encoding a form of encryption?

Absolutely not. URL encoding is a public, standard translation. Anyone with a decoder can see the original data. Never use URL encoding to "hide" sensitive information like passwords or private keys.

6. Common Mistakes

• Double Encoding: Encoding a string that is already encoded. This leads to results like %2520 (which is an encoded % followed by 20). This often happens when developers aren't sure if their framework has already handled encoding for them.
• Encoding the Protocol: As mentioned, encoding the http or https prefix will break the link.
• Forgetting to Decode: When reading values from a URL in your backend code, always remember to decode them. Most modern frameworks do this automatically, but legacy systems might not.

7. Use Cases

API Development

When building APIs, you frequently need to test how your server handles edge cases like extremely long strings, symbols, and non-English characters. This tool allows you to quickly generate these test strings.

SEO and Link Building

SEO specialists use URL encoders to ensure that their "slugs" (the descriptive part of the URL) are clean and won't be broken by social media platforms or email clients that might struggle with raw special characters.

Deep Linking in Mobile Apps

Mobile apps often use "custom schemes" (e.g., myapp://user/profile?name=John). Encoding the parameters in these deep links is vital for ensuring the app's router can correctly identify the destination.

8. Related Tools

• URL Parser: To see how a browser would break down the encoded URL you've just created.
• HTML Entities: For encoding characters for use inside an HTML document (like & instead of %26).
• Base64 Encoder: For converting binary data into a text format that is safe for URLs but more compact than percent-encoding for large blocks of data.
• JS String Escaper: For preparing strings to be used inside JavaScript code.