Component vs Full URL Encoding Standards
Easily toggle between encodeURIComponent (which escapes delimiters like ? / & = # for query values) and encodeURI (which preserves protocol and path delimiters for complete web addresses).
URL Encode & Decode Online
Free online URL encode and decode tool. Safely encode special characters into percent-encoded URLs (%20, %26) or decode query strings in real time.
Standard:
Space:
Presets:
Input Text / Raw URL45 chars · 45 bytes
Encoded Output71 chars · 71 bytes
RFC 3986 Reserved Characters Cheat Sheet
Percent CodesSpace%20 or +Separates words in URLs
!%21Exclamation mark
"%22Quotation mark
#%23Fragment identifier
$%24Dollar sign
%%25Percent delimiter
&%26Parameter separator
'%27Single quote
+%2BPlus sign (or space)
/%2FPath segment separator
:%3AScheme / Port separator
;%3BSub-parameter separator
<%3CLess than
=%3DKey-value separator
>%3EGreater than
?%3FQuery string start
@%40User-info delimiter
[%5BIPv6 / Array bracket
]%5DIPv6 / Array bracket
Developer Scenario: Safely Nesting a Callback URL into an OAuth Redirect
A frontend developer needs to pass a destination callback link with multiple query parameters into an authentication endpoint: https://auth.company.com/login?redirect=https://app.company.com/dashboard?view=metrics&period=monthly#live
| Unencoded Parameter | https://app.company.com/dashboard?view=metrics&period=monthly#live |
| Result of encodeURIComponent() | https%3A%2F%2Fapp.company.com%2Fdashboard%3Fview%3Dmetrics%26period%3Dmonthly%23live |
| Constructed OAuth URL | https://auth.company.com/login?redirect=https%3A%2F%2Fapp.company.com%2Fdashboard%3Fview%3Dmetrics%26period%3Dmonthly%23live |
💡 By encoding the redirect parameter with encodeURIComponent, the authentication server correctly interprets "view=metrics" and "period=monthly" as parameters of the destination URL rather than mistakenly parsing them as top-level parameters of the auth endpoint.
How to use URL Encode & Decode Online
- 1
Paste your raw text, query parameter string, or encoded URL into the input field.
- 2
Choose your encoding mode: select "URL Component" (encodeURIComponent) to escape parameter delimiters like & and =, or "Full URL" (encodeURI) to preserve overall URL structure.
- 3
Select your preferred space encoding (%20 for RFC 3986 or + for form-urlencoded), then click Copy Output or Swap to reverse operations.
Why use this tool?
Configurable Space Encoding (%20 vs +)
Switch instantly between standard RFC 3986 percent encoding (%20) and application/x-www-form-urlencoded format (+), ensuring full compatibility across backend frameworks like Express, Spring, and Django.
Live Character and Byte Counters with One-Click Reverse
Monitor exact UTF-8 character and byte lengths in real-time to avoid exceeding URL length limits (such as the 2,048 character limit in legacy web proxies). Swap input and output with one click for rapid iterative testing.
Continue your workflow
Building API requests or OAuth flows requiring random nonce tokens? Use the Generate secure URL tokens and random keys.
Need to format query parameter keys or slugify strings? Use the Convert parameter casing (camelCase, snake_case).
Need to spot exact character differences between two URL endpoints? Try the Compare query strings side-by-side.
Common URL Percent-Encoding Reference Table (RFC 3986)
Quick cheat-sheet of ASCII reserved characters, delimiters, and their standard percent-encoded hexadecimal values.
| Character | Name / Purpose | Percent Code (%HEX) | RFC 3986 Type |
|---|---|---|---|
| Space (" ") | Space character | %20 (or + in form data) | Reserved / Whitespace |
| ! | Exclamation mark | %21 | Sub-delimiter |
| # | Number sign / Hash fragment | %23 | Gen-delimiter |
| $ | Dollar sign | %24 | Sub-delimiter |
| & | Ampersand (parameter separator) | %26 | Sub-delimiter |
| ' | Single quote | %27 | Sub-delimiter |
| ( | Left parenthesis | %28 | Sub-delimiter |
| ) | Right parenthesis | %29 | Sub-delimiter |
| * | Asterisk | %2A | Sub-delimiter |
| + | Plus sign | %2B | Sub-delimiter |
| , | Comma | %2C | Sub-delimiter |
| / | Forward slash (path separator) | %2F | Gen-delimiter |
| : | Colon (scheme / port separator) | %3A | Gen-delimiter |
| ; | Semicolon (matrix parameter) | %3B | Sub-delimiter |
| = | Equals sign (key-value separator) | %3D | Sub-delimiter |
| ? | Question mark (query prefix) | %3F | Gen-delimiter |
| @ | At sign (userinfo delimiter) | %40 | Gen-delimiter |
| [ | Left bracket (IPv6 address) | %5B | Gen-delimiter |
| ] | Right bracket (IPv6 address) | %5D | Gen-delimiter |
| % | Percent sign (escape symbol) | %25 | Reserved escape |
Unreserved characters (A–Z, a–z, 0–9, hyphen "-", underscore "_", dot ".", and tilde "~") should never be percent-encoded.
Frequently asked questions
What is the difference between encodeURI() and encodeURIComponent()?
encodeURIComponent() encodes all reserved characters (such as ?, &, =, /, :, #, and +) into %XX hexadecimal byte codes. It is designed for individual query parameter values to ensure that special symbols do not interfere with URL syntax. In contrast, encodeURI() preserves reserved delimiter characters, only encoding spaces and non-ASCII/Unicode characters. Use encodeURI() when you want to encode an entire valid URL address.
Why does a space become "%20" in some places and "+" in others?
Both representations are valid, but they apply in different contexts. Under RFC 3986 (the core standard for URIs), a space must be encoded as "%20" across all URL paths and components. The "+" symbol comes from the HTML form specification (application/x-www-form-urlencoded), where spaces in query strings are replaced by "+". When decoding, most modern web servers treat both "%20" and "+" as valid spaces in query strings.
What is double-encoding and how do I prevent it?
Double-encoding happens when an already-encoded string is run through an encoder a second time. For example, the percent sign in "%20" is encoded into "%25", turning the space into "%2520". This often breaks API requests and URL routing. If you see "%25" appearing before hex codes in your URL parameters, your string has been double-encoded.
How are Unicode, accents, and emojis encoded in URLs?
Modern URL encoding converts all characters into their UTF-8 byte sequences first, then encodes each byte into a %XX hexadecimal pair. For example, the accented letter "é" consists of 2 UTF-8 bytes (0xC3 0xA9) and encodes to "%C3%A9". A 4-byte emoji like 🚀 encodes to "%F0%9F%9A%80".
What are unreserved characters in RFC 3986?
Unreserved characters are never percent-encoded by compliant URL encoders. They consist of uppercase letters (A–Z), lowercase letters (a–z), decimal digits (0–9), and four special punctuation marks: hyphen (-), underscore (_), period (.), and tilde (~).
Related tools
Everyday Utilities
Password Generator
Generate strong, cryptographically secure random passwords in bulk with custom length, bracket exclusion, and unique character options.
Text Comparison Tool
Compare two text snippets or code blocks side-by-side with highlighted character and line differences.
Case Converter
Convert text between UPPERCASE, lowercase, Title Case, camelCase, snake_case, and kebab-case.
Word and Character Counter
Count words, characters with/without spaces, lines, and paragraphs in real time.
Remove Duplicate Lines
Remove repeated lines while preserving their first occurrence.
Sort Lines
Sort lines naturally, alphabetically, or by length.