URL Encoder & Decoder

What is URL encoding?

URL encoding (also called percent encoding) converts characters that aren’t allowed in URLs into a format that is. Special characters are replaced with a percent sign followed by their hexadecimal ASCII value.

For example:

• Space becomes %20
• & becomes %26
• = becomes %3D
• ? becomes %3F

Why URL encoding matters

URLs have a specific syntax where certain characters have special meaning:

• ? starts the query string
• & separates parameters
• = separates keys from values
• / separates path segments
• # marks the fragment

If your data contains these characters, they must be encoded to avoid breaking the URL structure.

Without encoding:

https://example.com/search?q=rock & roll

This breaks - the browser thinks the query ends at the space.

With encoding:

https://example.com/search?q=rock%20%26%20roll

This works correctly.

Component vs full URL encoding

Component encoding (encodeURIComponent) encodes everything except:

• Letters (A-Z, a-z)
• Digits (0-9)
• - _ . ~

Use this for individual parameter values:

const query = encodeURIComponent("a=1&b=2");
// "a%3D1%26b%3D2"

Full URL encoding (encodeURI) preserves URL structure characters:

• : / ? # @ & = + $ ,

Use this for complete URLs where you want to preserve the structure:

const url = encodeURI("https://example.com/path?q=hello world");
// "https://example.com/path?q=hello%20world"

Common encoding mistakes

Double encoding:

// Wrong - encodes twice
encodeURIComponent(encodeURIComponent("hello world"));
// "hello%2520world" (the % got encoded to %25)

Using encodeURI for parameters:

// Wrong - doesn't encode &
const value = "rock & roll";
const url = `https://example.com?q=${encodeURI(value)}`;
// Breaks: "https://example.com?q=rock%20&%20roll"

Forgetting to decode:

// Data appears corrupted if you forget to decode
const param = "hello%20world";
console.log(param); // Shows encoded form
console.log(decodeURIComponent(param)); // "hello world"

URL encoding in different languages

JavaScript:

encodeURIComponent("hello world"); // "hello%20world"
decodeURIComponent("hello%20world"); // "hello world"

Python:

from urllib.parse import quote, unquote
quote("hello world")  # "hello%20world"
unquote("hello%20world")  # "hello world"

PHP:

urlencode("hello world");  // "hello+world"
rawurlencode("hello world");  // "hello%20world"

Spaces: %20 vs +

There are two ways to encode spaces:

• %20 - Standard percent encoding
• + - Form encoding (application/x-www-form-urlencoded)

Modern practice prefers %20 for consistency, but + is still common in form submissions.

How this tool works

Enter text to encode it for URL usage, or paste an encoded string to decode it. Choose between component encoding (for parameter values) and full URL encoding (preserves URL structure). Powered by a QuantCDN Edge Function.