How to URL Encode and Decode Online: A Developer's Guide

Quick Encode/Decode Online

For quick URL encoding or decoding, ToolMasta's URL encoder handles the task in seconds. It runs entirely in your browser — no data is sent to a server — making it safe for API keys, redirect URLs, and any other sensitive parameters.

To encode a value:

1. Open ToolMasta's URL Encoder
2. Select "Encode" mode
3. Paste the text you want to encode (e.g., a query parameter value)
4. The percent-encoded output appears immediately

To decode:

1. Select "Decode" mode
2. Paste the percent-encoded string
3. The human-readable output appears immediately

When to Encode

URL encode when any of these apply:

• You are inserting a dynamic value into a URL query parameter
• The value contains spaces, special characters, or non-ASCII text
• You are building a redirect URL that includes another URL as a parameter
• You are constructing an API request with complex filter values
• You received a URL from user input and are constructing it into a request

Do not encode when:

• The string is already percent-encoded (double-encoding breaks it)
• You are encoding the structural parts of a URL (scheme, host, path separators) — these should remain as-is

Encoding Query Parameters

Consider building a search URL programmatically:

const query = "C++ programming & algorithms";
const sort = "date/desc";
const url = `https://example.com/search?q=${encodeURIComponent(query)}&sort=${encodeURIComponent(sort)}`;
// Result:
// https://example.com/search?q=C%2B%2B%20programming%20%26%20algorithms&sort=date%2Fdesc

Notice that the ? and & between parameters are NOT encoded (they are part of the URL structure), but the values ARE encoded (the +, spaces, &, and / inside the values are all encoded).

Decoding Encoded URLs

When you receive a URL with percent-encoded characters and need to read the original value:

// JavaScript
decodeURIComponent("C%2B%2B%20programming%20%26%20algorithms")
// Returns: "C++ programming & algorithms"

// Python
from urllib.parse import unquote
unquote("C%2B%2B%20programming%20%26%20algorithms")
# Returns: 'C++ programming & algorithms'

ToolMasta's URL decoder handles this instantly for manual inspection — just paste the encoded string.

API Use Cases

REST API Query Parameters

Most REST APIs use query parameters to filter, sort, and paginate results. Values containing special characters must be encoded:

GET /api/products?name=Bob%27s+Burgers&category=food+%26+drink
Authorization: Bearer eyJ...

Encoding a URL as a Parameter

A common scenario is passing a URL as a redirect parameter:

// The redirect_uri must be fully encoded as it contains reserved characters
const redirectUri = encodeURIComponent("https://myapp.com/callback?mode=login");
const authUrl = `https://auth.example.com/authorize?client_id=abc&redirect_uri=${redirectUri}`;
// Result: https://auth.example.com/authorize?client_id=abc&redirect_uri=https%3A%2F%2Fmyapp.com%2Fcallback%3Fmode%3Dlogin

Webhook URLs with Signatures

Webhook signatures often include Base64 or hex-encoded binary values. When these appear as URL parameters, they must be encoded:

const sig = "sha256=abc+123/xyz==";
const encodedSig = encodeURIComponent(sig);
// Result: sha256%3Dabc%2B123%2Fxyz%3D%3D

Full URL vs Component Encoding

There are two modes of URL encoding, each appropriate for different situations:

Function	What it encodes	What it preserves	When to use
encodeURIComponent()	Everything except: A–Z a–z 0–9 - _ . ! ~ * ' ( )	Letters, digits, basic punctuation	Individual parameter values
encodeURI()	Characters not valid in URIs	URL structural chars: : / ? # [ ] @ ! $ & ' ( ) * + , ; =	Complete URL strings

Batch Encoding Multiple Parameters

When constructing a URL with many parameters, use a helper to encode all values at once. In JavaScript, the URLSearchParams API handles this cleanly:

const params = new URLSearchParams({
  q: "C++ programming",
  sort: "date/desc",
  category: "tech & science"
});
const url = `https://example.com/search?${params.toString()}`;
// URLSearchParams uses form encoding (+ for spaces), so the output will use + instead of %20

Note: URLSearchParams uses application/x-www-form-urlencoded encoding, which represents spaces as + rather than %20. This is correct for query strings but differs from standard percent-encoding.

Debugging URL Issues

Problem: Parameter value truncated

If a parameter value contains & or = and you are not encoding it, the URL parser will interpret these as delimiters and truncate the value. Encode the value with encodeURIComponent().

Problem: 404 or wrong resource

If a path segment contains a / that should be literal (e.g., a version string "v1/2"), failing to encode it as %2F will cause the URL parser to treat it as a path separator, pointing to the wrong resource.

Problem: Special characters in redirect URL

Redirect URLs passed as parameters must be fully encoded. The entire URL including its ://, ?, and & must become percent-encoded. Use encodeURIComponent() on the full redirect URL string.

Reference: Common Characters and Their Encodings

Character	Name	Percent-Encoded
Space	Space	%20
!	Exclamation mark	%21
"	Double quote	%22
#	Hash	%23
$	Dollar sign	%24
%	Percent	%25
&	Ampersand	%26
+	Plus sign	%2B
/	Slash	%2F
:	Colon	%3A
=	Equals sign	%3D
?	Question mark	%3F
@	At sign	%40