URL Encoder & Decoder Tool

What is URL Encoding?

URL Encoding, formally known as percent-encoding, is a mechanism for encoding information in a Uniform Resource Identifier (URI). URLs can only be sent over the Internet using the ASCII character set. Because URLs often contain characters outside the ASCII set (like spaces, emojis, or international characters), those characters must be converted into a valid ASCII format.

URL encoding replaces unsafe ASCII characters with a % followed by two hexadecimal digits representing the character's numeric value. For instance, a simple space character is replaced by %20.

What is Percent Encoding?

Percent-encoding is the exact technical term for URL encoding defined by RFC 3986. The concept is simple: if a character is reserved or not allowed in a URI, the browser or server replaces it with a percent sign % and its hexadecimal byte value.

For example, the exclamation mark ! becomes %21, and the hash symbol # becomes %23. This prevents web servers from confusing the data within a URL with the structural components of the URL itself (like fragments or query delimiters).

How URL Encoding Works

When a browser encounters a URL, it needs to parse it into distinct parts: protocol, domain, path, query parameters, and fragments. Certain characters are "reserved" because they are used as delimiters to separate these parts.

If you want to pass a reserved character as actual data (for instance, passing the string user@domain.com as a query parameter), the @ symbol must be encoded to %40 so the browser doesn't mistakenly think it's part of an authentication string.

When encoding a string, the system processes it byte by byte. If it's a standard ASCII character, it checks if it's reserved or unsafe. If it is, it applies percent-encoding. For modern Unicode characters (like Emojis or foreign languages), the character is first converted into a UTF-8 byte sequence, and then each byte is percent-encoded.

URL Encoding vs Decoding

• URL Encoding translates unsafe or reserved characters into percent-encoded hexadecimal representations to ensure safe transit over HTTP.
• URL Decoding is the reverse process. It scans the string for % symbols followed by two hex digits and converts them back into their original characters.

Developers encode URLs when sending data via API requests, redirecting users, or building query strings. They decode URLs when receiving data on the server side to read the actual intended values.

Why Developers Encode URLs

Encoding URLs is non-negotiable for modern web development. Some critical reasons include:

Query Parameters: Search engines and APIs rely heavily on query strings (e.g., ?query=hello+world). If a user searches for something containing an ampersand (like "AT&T"), the & must be encoded as %26. Otherwise, the server will interpret it as the start of a brand new parameter.

Form Submissions: When HTML forms are submitted via the GET method, the browser automatically URL-encodes the input fields. Understanding how this works is vital for backend developers parsing form data.

Cross-Site Scripting (XSS) Prevention: Encoding user input before placing it into a URL prevents malicious users from injecting JavaScript into the address bar.

Reserved URL Characters

RFC 3986 defines a set of "reserved" characters that have special meaning in URLs. If you intend to use these characters as data, they must be encoded:

• : (Colon) -> %3A
• / (Slash) -> %2F
• ? (Question Mark) -> %3F
• # (Hash/Pound) -> %23
• [ and ] (Brackets) -> %5B and %5D
• @ (At Symbol) -> %40
• !, $, &, ', (, ), *, +, ,, ;, =

Unsafe URL Characters

In addition to reserved characters, there are "unsafe" characters that should always be encoded because different systems handle them unpredictably. This includes the Space character (%20 or +), quotation marks ("), angle brackets (<, >), and the percent sign itself (%25).

encodeURI vs encodeURIComponent

If you are a JavaScript developer, you will frequently use two built-in functions: encodeURI() and encodeURIComponent(). Understanding the difference is crucial.

encodeURI(): Used to encode a completely functional, full URL. It ignores protocol prefixes (like http://) and domain separators. It will NOT encode characters like ?, =, &, /, or : because doing so would break the URL structure.

encodeURIComponent(): Used to encode a specific component of a URL, typically a query parameter value. It encodes almost everything, including ?, =, &, and /.

Rule of Thumb: If you are building a query string like ?name=${value}, always use encodeURIComponent(value).

UTF-8 URL Encoding and Unicode

In the early days of the web, URLs only supported basic ASCII characters. Today, Internationalized Resource Identifiers (IRIs) allow URLs to contain characters from almost any language on Earth.

When a browser encounters a Unicode character (like the Japanese character "本" or a smiley face emoji "😀"), it converts that character into UTF-8 bytes, and then percent-encodes each byte.

For example, the smiley face emoji requires four bytes in UTF-8. Therefore, URL encoding it results in a massive 12-character string: %F0%9F%98%80. Our advanced encoder perfectly handles complex Unicode sequences seamlessly.

Common URL Encoding Mistakes

1. Double Encoding: Encoding an already-encoded string. For instance, encoding a space ( ) turns it into %20. Encoding it again turns the % into %25, resulting in %2520. This breaks backend parsing. Our tool highlights potential double-encoded segments.
2. Encoding the Full URL Incorrectly: Using encodeURIComponent on a full URL turns https://google.com into https%3A%2F%2Fgoogle.com, which a browser cannot navigate to.
3. Mishandling Spaces: In query parameters, a space is traditionally encoded as a plus sign (+), while in URL paths, it is encoded as %20.

URL Encoding in APIs

Modern REST APIs send and receive data primarily through URLs and JSON. When designing an API endpoint like /api/users/{username}, if a username contains a slash (e.g., john/doe), the server will misinterpret it as two separate folder paths (/api/users/john/doe). The frontend must encode the username to john%2Fdoe so the API router matches the endpoint correctly.

Security Considerations

URL encoding is crucial for avoiding injection attacks. When reflecting user input directly into a hyperlink or an image src tag, failing to URL-encode the string allows attackers to break out of the HTML attribute by injecting quotation marks.

However, remember that URL encoding is not encryption. It provides zero confidentiality and is completely reversible by anyone. Do not pass sensitive information (like passwords or API keys) in URLs, as they will be saved in browser history, proxy logs, and server access logs—even if they are encoded.

Browser Compatibility

URL encoding is universally supported across every modern and legacy browser. All browsers implicitly encode Unicode domains (via Punycode) and paths automatically when a user hits enter in the address bar. Our tool replicates this standard behavior, ensuring the strings you generate here will behave identically in Chrome, Safari, Firefox, and Edge.