Home›Formatters›Data›URL Encoder / Decoder

URL Encoder / Decoder

Data

Encode special characters in URLs using percent-encoding, or decode percent-encoded URLs back to plain text. Free, instant, client-side — nothing is uploaded.

Reviewed by the thecalcu.com team · Last updated June 21, 2026

What is a URL Encode?

A URL Encoder / Decoder converts text to and from percent-encoding, the mechanism defined in RFC 3986 for safely embedding arbitrary characters in a URL. URLs may only contain a restricted set of characters: unreserved characters (letters, digits, -, _, ., ~) and a fixed set of reserved characters that carry structural meaning (:, /, ?, #, [, ], @, !, $, &, ', (, ), *, +, ,, ;, =). Any other character, spaces, accented letters, symbols, must be percent-encoded by replacing each byte with %XX, where XX is the byte's hexadecimal value.

This tool exposes two encoding functions used in JavaScript and every web platform:

  • encodeURIComponent, encodes a single URL component (a query parameter value, a path segment). Encodes everything except letters, digits, and - _ . ! ~ * ' ( ). Use this for data values within a URL.
  • encodeURI, encodes a complete URI while preserving its structural characters (:, /, ?, #, &, =, etc.). Use this when you want to make an entire URL text-safe without breaking its structure.

Decoding always uses decodeURIComponent, which handles all percent-encoded sequences correctly. If you need to encode binary data for non-URL contexts, use the Base64 Encoder / Decoder instead.

Why Use a URL Encoder / Decoder?

URLs in browser address bars often appear decoded for readability, but the actual network request uses the encoded form. When building APIs, constructing redirect URLs, or debugging network traffic, you need to switch between these representations quickly.

Common situations: a search query with special characters breaks a URL; a file path with spaces needs to be embedded in a redirect parameter; a webhook URL with & in query values needs encoding before being stored in a config file.

Who Should Use This Tool?

Back-end and API developers, encode query parameters when constructing URLs programmatically, decode incoming request parameters for inspection.

Front-end developers, verify query string values are correctly encoded before they are sent, and decode URL parameters when debugging redirect chains.

DevOps engineers, encode values in webhook URLs and callback endpoints that are stored in configuration files or environment variables.

QA engineers, test how applications handle special characters in URL parameters by generating encoded variants.

What Insights Does This Formatter Give You?

Encoding mode produces the percent-encoded form of the input, using either encodeURIComponent (for data values) or encodeURI (for full URIs). Decoding mode converts any percent-encoded input back to readable text.

If decoding fails, a specific error identifies malformed percent-sequences in the input.

How to use this URL Encode calculator

  1. Paste your text or encoded URL into the Input field.
  2. Select Encode → percent-encoded or Decode ← percent-encoded from the Mode selector.
  3. For encoding, select the Scope: Encode component for query parameter values, or Encode full URI for a complete URL.
  4. The output appears instantly in the Output field.
  5. Copy the result using the copy icon.

Formula & Methodology

Encoding a component (encodeURIComponent):
- Encodes all characters except: A–Z a–z 0–9 - _ . ! ~ * ' ( )
- Each character is converted to its UTF-8 byte sequence, each byte expressed as %XX
- Example: hello world → hello%20world
- Example: name=value&key=other → name%3Dvalue%26key%3Dother

Encoding a full URI (encodeURI):
- Same as above but additionally preserves: ; , / ? : @ & = + $ #
- Example: https://example.com/search?q=hello world → https://example.com/search?q=hello%20world

Decoding (decodeURIComponent):
- Replaces each %XX sequence with the corresponding UTF-8 byte, then decodes the byte sequence as Unicode text

Valid example: q=hello world&lang=en → q=hello%20world%26lang%3Den (component-encoded)

Invalid decode example: hello%2Gworld, %2G is malformed because G is not a valid hexadecimal digit

Frequently Asked Questions

URL encoding, formally called percent-encoding, replaces characters that are not allowed or have special meaning in URLs with a % sign followed by two hexadecimal digits representing the character's UTF-8 byte value. For example, a space becomes %20, and & becomes %26. This allows arbitrary text to be safely embedded in URLs without breaking their structure.
encodeURI encodes a complete URI and preserves characters that are part of the URL structure, it does not encode :, /, ?, #, &, =, @, and a few others. encodeURIComponent encodes a single component (such as a query parameter value) and encodes everything except letters, digits, and - _ . ! ~ * ' ( ). Use encodeURIComponent for query parameter values; use encodeURI when you want to encode a full URL.
Use URL encoding when: building URLs programmatically with user-supplied values (names, search queries, addresses), constructing query string parameters that contain special characters like &, =, or spaces, passing data in GET request parameters, and encoding form data in application/x-www-form-urlencoded format.
In the URI standard (RFC 3986), spaces are encoded as %20. In the older application/x-www-form-urlencoded format used by HTML forms, spaces are encoded as +. Both are valid in their respective contexts. encodeURIComponent always produces %20; HTML form submission may produce +. When decoding, %20 and + in form data both represent a space.
The unreserved characters that never need encoding are: A–Z, a–z, 0–9, hyphen (-), underscore (_), dot (.), and tilde (~). Reserved characters like / # ? & = have structural roles in URLs and should only appear in their syntactic positions, they must be encoded when used as literal data values in a query parameter.
Yes, use the 'Decode ← percent-encoded' mode with 'Encode full URI' scope. decodeURI decodes %XX sequences while leaving the structural reserved characters intact. This is useful for making encoded URLs readable without breaking their structure.
No. All encoding and decoding runs entirely in your browser, nothing is transmitted to any server. URLs often contain paths, query strings, or authentication tokens that are sensitive, so client-side processing is essential.
A percent-encoded sequence is a % character followed by exactly two uppercase hexadecimal digits representing one byte of a UTF-8 encoding. For example, the euro sign € is encoded as three bytes (0xE2, 0x82, 0xAC) which become %E2%82%AC in a URL. Sequences like %2G (G is not a valid hex digit) or a lone % with no following digits are malformed.
'Encode component' uses encodeURIComponent, it encodes everything except letters, digits, and a few safe punctuation marks. Use this for individual query parameter names and values. 'Encode full URI' uses encodeURI, it preserves URL-structural characters like :, /, ?, &, #, and =. Use this when you want to encode an entire URL while keeping its structure intact.
Both convert data to a text-safe representation, but for different purposes. URL encoding (percent-encoding) is specifically for URLs, it encodes characters not safe in URI syntax using %XX notation. Base64 converts arbitrary bytes to a 64-character alphabet, primarily for embedding binary data in text formats like JSON or email. For Base64 encoding, use the [Base64 Encoder / Decoder](/base64-formatter/).
A decoding error means the input contains a malformed percent-encoded sequence, typically a % not followed by two valid hexadecimal digits (e.g. %GG or a trailing % with nothing after it). Identify and fix the malformed sequence in the input. Sometimes these appear when a URL has been double-encoded (%25 instead of %).
Also known as
url encodeurl decodepercent encodepercent decodeencode url stringdecode url stringurlencode online