URL Encoder / Decoder

What Is a URL Encoder / Decoder?

A URL encoder and decoder is a developer utility that converts text containing special characters into a format safe for inclusion in a URL, and conversely decodes percent-encoded strings back into their original, human-readable form. URLs are governed by a strict specification (RFC 3986) that only allows a limited set of characters to appear unmodified — letters, digits, hyphens, underscores, periods, and tildes. Every other character must be represented using percent-encoding, where the character is replaced by a percent sign followed by its two-digit hexadecimal ASCII code. This tool handles both directions of that conversion instantly, making it an everyday essential for web developers, QA engineers, API integrators, and anyone who works with URLs professionally.

Why URL Encoding Matters

The web depends on URLs as the universal addressing system for resources. When those URLs contain user-generated text, query parameters, or data from external sources, special characters can silently corrupt the URL structure — breaking links, causing server errors, and producing security vulnerabilities. URL encoding is the mechanism that prevents these problems. Here is why it is indispensable:

• Query string safety: Characters like &,=, ?, and # have special meaning in URL query strings. Without encoding, a user's search query containing any of these characters would be misinterpreted as URL syntax rather than data.
• API request construction: When building HTTP requests programmatically — whether in REST clients, backend services, or frontend JavaScript — values passed as URL parameters must be encoded to guarantee correct transmission regardless of their content.
• Form submission handling: HTML forms submitted via GET method encode their field values into the URL. Understanding this encoding is essential for debugging form behavior and for processing form data correctly on the server side.
• Security and injection prevention: Proper URL encoding prevents certain classes of injection attacks where malicious characters embedded in a URL could alter the intended request structure. It is a fundamental layer of web application security.
• Internationalization: Non-ASCII characters — including accented letters, Chinese characters, Arabic script, emojis, and any character outside the basic Latin alphabet — cannot appear in URLs without encoding. URL encoding makes the web accessible across all human languages.

How URL Encoding Works

URL encoding follows a simple but precise rule defined in RFC 3986. When a character is not in the set of "unreserved characters" (A–Z, a–z, 0–9, hyphen, underscore, period, tilde), it must be percent-encoded. The encoding process works as follows:

• The character is converted to its UTF-8 byte sequence (for ASCII characters, this is simply their ASCII code; for multi-byte Unicode characters, it may be two, three, or four bytes).
• Each byte is written as a two-digit uppercase hexadecimal number preceded by a percent sign.
• For example, a space character (ASCII 32, hex 20) becomes %20. The ampersand character (ASCII 38, hex 26) becomes %26. The copyright symbol (©) becomes %C2%A9 in its two-byte UTF-8 encoding.

This tool uses JavaScript's encodeURIComponent() function for encoding, which correctly handles all Unicode characters and encodes all characters except A–Z, a–z, 0–9, hyphen, underscore, period, exclamation mark, tilde, asterisk, single quote, and parentheses. For decoding, it uses decodeURIComponent(), which reverses the process for all valid percent-encoded sequences.

encodeURIComponent vs encodeURI: What Is the Difference?

JavaScript provides two encoding functions, and understanding when to use each prevents a common source of bugs:

• encodeURIComponent is used to encode individual URL components — specifically, query parameter names and values, path segments, or any text that will be inserted into an existing URL structure. It encodes reserved characters like/, ?, #, &, and =, because these have structural meaning in URLs and should not appear unencoded inside a parameter value.
• encodeURI is used to encode a complete URL. It does not encode reserved characters because they are assumed to be part of the URL's intended structure — it only encodes characters that are truly illegal in URLs, like spaces and non-ASCII characters. Using encodeURI on a query parameter value can leave & and = characters unencoded, corrupting the parameter structure.

This tool uses encodeURIComponent, which is the correct and safer choice for encoding user-provided values, API parameters, and any text that will be embedded within a URL rather than used as a complete URL itself.

Real-World Examples

Example 1: Encoding a Search Query

A user searches for "coffee & tea shops near me" on a website. The application must encode this query before appending it to the search URL. The encoded result iscoffee%20%26%20tea%20shops%20near%20me — the spaces become%20 and the ampersand becomes %26, preventing the server from interpreting the & as a query parameter separator.

Example 2: Decoding a Redirected URL

A developer inspecting an authentication redirect URL sees a return_urlparameter with the valuehttps%3A%2F%2Fapp.example.com%2Fdashboard%3Ftab%3Dsettings. Pasting this into the decoder instantly reveals the original URL:https://app.example.com/dashboard?tab=settings — making the redirect destination immediately readable without manual substitution of each percent sequence.

Example 3: Building an API Request

A developer integrating with a mapping API needs to pass an address as a query parameter: "1600 Pennsylvania Avenue NW, Washington, D.C." Encoding produces1600%20Pennsylvania%20Avenue%20NW%2C%20Washington%2C%20D.C. — spaces, commas, and periods all properly encoded, ensuring the API receives the address as a single unambiguous parameter value rather than a broken URL.

Example 4: Internationalizing a URL

A multilingual application needs to embed a Japanese product name ("コーヒー", meaning "coffee") in a URL. Encoding converts the multi-byte UTF-8 characters into a sequence of percent-encoded bytes that any web server and browser can parse correctly, regardless of their locale settings.

Tips for Best Results

• Encode values, not entire URLs: If you have a complete URL and need to encode only its query parameter values, copy just the values — not the entire URL — into the encoder. Encoding a full URL with this tool will also encode the slashes, colons, and question marks that are part of the URL structure, breaking it.
• Decode before re-encoding: If you receive a percent-encoded string and are unsure whether it has been encoded once or multiple times (double-encoding is a common bug), decode it first. If the decoded result still contains percent sequences, decode again until you reach the original plain text.
• Check for plus signs in form data: HTML forms submitted via GET sometimes encode spaces as + rather than %20 (this is the application/x-www-form-urlencoded format). The standard decodeURIComponentfunction does not convert + back to spaces — if your encoded string uses plus signs for spaces, replace them with %20 before decoding with this tool.
• Use the decoder to read webhook payloads: Webhook bodies and callback URLs from payment gateways, OAuth providers, and third-party services often contain heavily encoded parameters. Decoding them here makes the content immediately readable for debugging.
• Validate your output: After encoding, paste the result into a URL in your browser to verify it navigates or resolves as expected before embedding it in production code or sharing it with others.

Common Mistakes to Avoid

• Double-encoding: If text has already been URL-encoded and you encode it again, the percent signs themselves get encoded — turning %20 into%2520. This is one of the most common bugs in URL handling. Always check whether your input is already encoded before encoding it again.
• Forgetting to encode both key and value in query parameters: In a query string like ?search=coffee+%26+tea, both the parameter name (search) and its value must be encoded if they contain special characters. Encoding only the value and leaving special characters in the key can still corrupt the query string structure.
• Using URL encoding for Base64 data in URLs: While it is technically valid to URL-encode Base64 strings, Base64's use of +,/, and = characters produces verbose percent-encoded output. Consider using Base64 URL-safe encoding (which substitutes - for+ and _ for /) instead for cleaner URLs.
• Assuming decoding always recovers the original text: If a percent sequence in your input does not correspond to a valid UTF-8 byte sequence, decoding will throw an error. This can happen with malformed or partially corrupted encoded strings.

Frequently Asked Questions (FAQ)

What characters need to be URL-encoded?

Any character that is not in the unreserved set (A–Z, a–z, 0–9, hyphen, underscore, period, tilde) must be encoded when used as data within a URL component. This includes spaces, punctuation marks (!, @, #,$, %, &, *, etc.), and all non-ASCII characters. Reserved characters like /, ?,=, and & also need encoding when used as data values rather than as structural URL syntax.

Why does a space sometimes appear as %20 and sometimes as +?

The %20 encoding is defined by RFC 3986 and is the correct encoding for spaces in all URL components. The + encoding for spaces is a legacy convention from the HTML form submission specification (application/x-www-form-urlencoded) and is only valid within query strings in that specific context. Modern APIs and frameworks typically expect and produce %20, while HTML form GET submissions may use +. This tool always produces %20, which is universally correct.

Is URL encoding the same as HTML encoding?

No. URL encoding (percent-encoding) replaces characters with %XX sequences for safe transmission in URLs. HTML encoding (HTML entity encoding) replaces characters with named or numeric HTML entities like &, <, and " for safe embedding in HTML documents. Both serve the same general purpose — making special characters safe in a specific context — but use completely different syntax and are not interchangeable.

Can this tool handle Unicode characters?

Yes. The encodeURIComponent function correctly encodes all Unicode characters, including accented Latin characters, Chinese, Japanese, Korean, Arabic, Cyrillic, emoji, and any other Unicode code point, into their UTF-8 byte sequence represented as percent-encoded sequences. The decoder correctly reverses this process for all valid UTF-8 percent sequences.

What happens if I try to decode an invalid percent-encoded string?

If your input contains a percent sign followed by characters that are not valid hexadecimal digits, or percent-encoded sequences that do not form valid UTF-8, the decoder will throw a URI malformed error. The tool displays this error clearly so you can identify and correct the malformed sequences in your input.

Is URL encoding secure?

URL encoding is not an encryption or security mechanism — it is a character escaping convention for safe URL transmission. It does not hide or protect the content it encodes; anyone can trivially decode a percent-encoded string. For secure transmission of sensitive data, use HTTPS and appropriate encryption. URL encoding is one layer of input sanitization but should never be relied upon as a sole security measure.

Related Tools

URL encoding is part of a broader ecosystem of data encoding and formatting tools. These work naturally alongside it:

• Use our Base64 Encoder/Decoder when you need to encode binary data or long text strings for safe transmission in URLs, HTTP headers, or JSON payloads — Base64 is the complement to URL encoding for binary content.
• The JSON Formatter pairs perfectly when you are working with API requests where URL-encoded parameters carry JSON values — format the JSON first, then URL-encode it for safe inclusion in query strings.
• Try our Percentage Calculator for quick numeric work when analyzing API response data or calculating rates from URL-tracked analytics parameters.
• The Unit Converter is useful alongside URL building when working with location-based APIs that accept coordinates or measurement values as URL parameters.
• Our Date Calculator helps when constructing date-range API queries where start and end dates need to be formatted and URL-encoded as ISO 8601 strings in query parameters.