Documentation
How to use this tool, practical use cases, and technical notes.
The URL Encoder / Decoder is designed for immediate use — no configuration, no learning curve. Here is a complete walkthrough of every feature and how to get the most value from each one.
Basic Encode Operation
Goal: Convert plain text to a URL-safe encoded string.
Click the "Encode" tab (active by default).
In the Input Text field, type or paste the text you want to encode.
The output field updates in real time — no button press required.
Click the copy icon next to the output to copy the encoded string to your clipboard.
Use the "Clear" button to reset both fields.
Example:
Input | Output (Encoded) |
|---|---|
|
|
|
|
|
|
|
|
|
|
|
|
Basic Decode Operation
Goal: Convert a percent-encoded string back to human-readable plain text.
Click the "Decode" tab.
Paste your percent-encoded string into the Input Text field.
The decoded output appears instantly in the output panel.
The tool validates the encoding format before decoding — malformed sequences are flagged.
Example:
Input (Encoded) | Output (Decoded) |
|---|---|
|
|
|
|
|
|
|
|
|
|
|
|
Auto-Detect Mode
When you are unsure whether your input is encoded or plain text, switch to "Auto-detect". The tool inspects the input for %XX patterns and the presence of unencoded reserved characters to determine whether to encode or decode — then applies the appropriate operation automatically.
When Auto-detect is reliable:
Input is clearly encoded (contains
%20,%3D, etc.)Input is clearly plain text (contains raw spaces,
@,&, etc.)
When to override Auto-detect:
Input contains both encoded and unencoded sections (partially encoded strings)
You want to double-encode (encode an already-encoded string)
You are testing specific edge cases
Component Mode
Goal: Parse a complete URL and encode/decode each structural component independently.
Switch to "Component" mode and paste a full URL. The tool splits the URL into:
URL Component | Example | Encoding Behavior |
|---|---|---|
Scheme |
| Never encoded |
Username |
|
|
Password |
|
|
Host / Domain |
| Punycode for IDN; not percent-encoded |
Port |
| Never encoded |
Path |
| Path segment encoding (preserves |
Query string |
|
|
Fragment |
|
|
This mode is especially valuable when you need to encode only the query parameters of a URL without accidentally encoding the slashes in the path or the :// in the scheme.
URI Mode
Toggle "URI" mode to switch from encodeURIComponent to encodeURI encoding semantics. This mode is designed for encoding a complete, structurally intact URL when you need to make it safe for embedding in HTML, Markdown links, email clients, or configuration files — without breaking the URL's structure.
Character | encodeURIComponent | encodeURI (URI mode) |
|---|---|---|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Space |
|
|
|
|
|
Batch Mode
Goal: Encode or decode multiple strings simultaneously.
Switch to "Batch Mode".
Enter one value per line in the input area.
The output panel displays the encoded/decoded version of each line in the same order.
Copy the entire batch output at once.
Batch Mode is ideal for:
Encoding a list of usernames, emails, or IDs for bulk URL construction
Decoding multiple query parameter values extracted from server logs
Processing a list of file paths or API endpoint parameters
Security testing: generating a batch of encoded payloads for fuzzing
URL Parser
The URL Parser feature deconstructs any URL you paste into a clearly labeled component breakdown. This is particularly useful when debugging complex URLs with multiple query parameters, authentication credentials embedded in the URL, or non-standard ports and paths.
Example input: https://api.example.com:8443/v2/search?q=hello world&lang=en#results
Parsed Component | Value |
|---|---|
Scheme |
|
Host |
|
Port |
|
Path |
|
Query string |
|
Query parameters |
|
Fragment |
|
Visual Map
The Visual Map mode provides a character-level overlay of the encoded output, highlighting which characters were encoded, what they encode to, and their hex values. This is particularly valuable for:
Learning exactly which characters triggered encoding and why
Debugging partially encoded strings with mixed safe/unsafe characters
Security research: visualizing encoding patterns in suspicious URLs
Preset Templates
The tool ships with six preset templates that populate the input field with a representative example and apply the relevant encoding. Click any preset to instantly see how that input type gets encoded:
Preset | Input Example | Primary Learning |
|---|---|---|
Email Address |
|
|
Form Data |
| Space → |
Search Query |
| Multi-word URL encoding |
API Parameter |
|
|
File Path |
|
|
Special Characters |
| Multiple reserved characters |
History
Every encode/decode operation is logged to the History panel within your session. History lets you:
Review previous conversions without re-entering input
Click any history item to reload it into the input field
Track a sequence of encoding operations when debugging a complex URL
History is session-only and clears automatically when you close or refresh the tab — nothing is stored persistently.
The URL Encoder / Decoder is designed for immediate use — no configuration, no learning curve. Here is a complete walkthrough of every feature and how to get the most value from each one.
Basic Encode Operation
Goal: Convert plain text to a URL-safe encoded string.
Click the "Encode" tab (active by default).
In the Input Text field, type or paste the text you want to encode.
The output field updates in real time — no button press required.
Click the copy icon next to the output to copy the encoded string to your clipboard.
Use the "Clear" button to reset both fields.
Example:
Input | Output (Encoded) |
|---|---|
|
|
|
|
|
|
|
|
|
|
|
|
Basic Decode Operation
Goal: Convert a percent-encoded string back to human-readable plain text.
Click the "Decode" tab.
Paste your percent-encoded string into the Input Text field.
The decoded output appears instantly in the output panel.
The tool validates the encoding format before decoding — malformed sequences are flagged.
Example:
Input (Encoded) | Output (Decoded) |
|---|---|
|
|
|
|
|
|
|
|
|
|
|
|
Auto-Detect Mode
When you are unsure whether your input is encoded or plain text, switch to "Auto-detect". The tool inspects the input for %XX patterns and the presence of unencoded reserved characters to determine whether to encode or decode — then applies the appropriate operation automatically.
When Auto-detect is reliable:
Input is clearly encoded (contains
%20,%3D, etc.)Input is clearly plain text (contains raw spaces,
@,&, etc.)
When to override Auto-detect:
Input contains both encoded and unencoded sections (partially encoded strings)
You want to double-encode (encode an already-encoded string)
You are testing specific edge cases
Component Mode
Goal: Parse a complete URL and encode/decode each structural component independently.
Switch to "Component" mode and paste a full URL. The tool splits the URL into:
URL Component | Example | Encoding Behavior |
|---|---|---|
Scheme |
| Never encoded |
Username |
|
|
Password |
|
|
Host / Domain |
| Punycode for IDN; not percent-encoded |
Port |
| Never encoded |
Path |
| Path segment encoding (preserves |
Query string |
|
|
Fragment |
|
|
This mode is especially valuable when you need to encode only the query parameters of a URL without accidentally encoding the slashes in the path or the :// in the scheme.
URI Mode
Toggle "URI" mode to switch from encodeURIComponent to encodeURI encoding semantics. This mode is designed for encoding a complete, structurally intact URL when you need to make it safe for embedding in HTML, Markdown links, email clients, or configuration files — without breaking the URL's structure.
Character | encodeURIComponent | encodeURI (URI mode) |
|---|---|---|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Space |
|
|
|
|
|
Batch Mode
Goal: Encode or decode multiple strings simultaneously.
Switch to "Batch Mode".
Enter one value per line in the input area.
The output panel displays the encoded/decoded version of each line in the same order.
Copy the entire batch output at once.
Batch Mode is ideal for:
Encoding a list of usernames, emails, or IDs for bulk URL construction
Decoding multiple query parameter values extracted from server logs
Processing a list of file paths or API endpoint parameters
Security testing: generating a batch of encoded payloads for fuzzing
URL Parser
The URL Parser feature deconstructs any URL you paste into a clearly labeled component breakdown. This is particularly useful when debugging complex URLs with multiple query parameters, authentication credentials embedded in the URL, or non-standard ports and paths.
Example input: https://api.example.com:8443/v2/search?q=hello world&lang=en#results
Parsed Component | Value |
|---|---|
Scheme |
|
Host |
|
Port |
|
Path |
|
Query string |
|
Query parameters |
|
Fragment |
|
Visual Map
The Visual Map mode provides a character-level overlay of the encoded output, highlighting which characters were encoded, what they encode to, and their hex values. This is particularly valuable for:
Learning exactly which characters triggered encoding and why
Debugging partially encoded strings with mixed safe/unsafe characters
Security research: visualizing encoding patterns in suspicious URLs
Preset Templates
The tool ships with six preset templates that populate the input field with a representative example and apply the relevant encoding. Click any preset to instantly see how that input type gets encoded:
Preset | Input Example | Primary Learning |
|---|---|---|
Email Address |
|
|
Form Data |
| Space → |
Search Query |
| Multi-word URL encoding |
API Parameter |
|
|
File Path |
|
|
Special Characters |
| Multiple reserved characters |
History
Every encode/decode operation is logged to the History panel within your session. History lets you:
Review previous conversions without re-entering input
Click any history item to reload it into the input field
Track a sequence of encoding operations when debugging a complex URL
History is session-only and clears automatically when you close or refresh the tab — nothing is stored persistently.