URL Percent-Encoder (Live RFC 3986 URI Parameter Tool)
Encode and decode query string parameters, URI path segments, and reserved ASCII characters under IETF RFC 3986 standards. Toggle between full URI encoding and component-level parameter escaping with support for both %20 and + space formats.
URL percent-encoding is a mechanism defined in RFC 3986 to represent reserved or non-ASCII characters in a URI. Characters are replaced with a percent sign (%) followed by two hexadecimal digits representing their UTF-8 byte value (e.g., a space becomes %20, and an ampersand becomes %26).
The Mechanics of RFC 3986 Percent-Encoding
Under RFC 3986, Uniform Resource Identifiers (URIs) are strictly limited to a small subset of US-ASCII characters. Characters outside this safe spectrum are represented using a percent-encoding triplet:
When non-ASCII characters (such as accents or emojis) are encountered, the character is first converted into its UTF-8 octets, and each individual byte is percent-encoded:
- Space (ASCII 32 / 0x20): Encodes to
%20. - Ampersand (ASCII 38 / 0x26): Encodes to
%26. - Accented é (UTF-8 Bytes 0xC3 0xA9): Encodes to two triplets:
%C3%A9. - Rocket Emoji &rocket; (UTF-8 Bytes 0xF0 0x9F 0x9A 0x80): Encodes to four triplets:
%F0%9F%9A%80.
RFC 3986 Reserved vs. Unreserved Characters Reference Matrix
| Character Group | Characters Included | Encoding Rule | Architectural Purpose |
|---|---|---|---|
| Unreserved Characters | A-Z a-z 0-9 - _ . ~ | Never Encoded | Safe across all URL paths and parameters. |
| Reserved Delimiters (Gen-Delims) | : / ? # [ ] @ | Encoded in Query Values | Define URI schemes, paths, queries, and fragments. |
| Sub-Delimiters (Sub-Delims) | ! $ & ' ( ) * + , ; = | Encoded in Query Values | Separate query parameters (e.g., & and =). |
`encodeURI()` vs. `encodeURIComponent()` in JavaScript
A frequent bug in web development occurs when developers use encodeURI() on a query parameter value:
// Flawed parameter encoding (encodeURI leaves '&' and '=' unencoded):
const query = encodeURI("search & destroy"); // "search%20&%20destroy" • Breaks query parser!
// Correct parameter encoding (encodeURIComponent escapes '&'):
const safeQuery = encodeURIComponent("search & destroy"); // "search%20%26%20destroy"
- Use
encodeURIComponent(): When encoding individual query parameter values (e.g.,?name=VALUE) or path segments. It safely escapes structural delimiters like&,=,/, and?. - Use
encodeURI(): Only when encoding a full, complete URL. It preserves structural protocol delimiters (https://,?,&) while escaping illegal characters like spaces.
The "Plus Sign in URL Path" 404 Trap
In HTML form submissions (using the application/x-www-form-urlencoded media type), web browsers historically replace spaces with a plus sign (+).
+) only represents a space inside the query string portion of a URL (after the ?). If you use a plus sign in a URL path segment (e.g., /blog/post+title), web servers like Nginx and Apache interpret the plus sign literally, triggering broken links and 404 errors. For path segments, always use hyphens (-) via our Slug Generator or standard %20.
Related URL & Encoding Utilities:
- Full URL Converter Hub — Master percent-encoding and decoding tool.
- SEO URL Slug Generator — Clean headlines into lowercase, hyphenated URL permalinks.
- HTML Entity Converter — Escape symbols (<, >) for web markup security.
- HTML Entities vs. URL Encoding Guide — Technical comparison of web encoding standards.
- What is a URL Slug? — SEO permalink structuring guide.
Frequently Asked Questions
What is the difference between %20 and + for space encoding?
Under RFC 3986 URI standards, spaces must be percent-encoded as %20. The plus sign (+) is used specifically in application/x-www-form-urlencoded query strings generated by HTML form submissions. In standard URI paths, + represents a literal plus sign.
Why are unreserved characters never percent-encoded?
RFC 3986 defines uppercase letters (A–Z), lowercase letters (a–z), digits (0–9), hyphens (-), underscores (_), periods (.), and tildes (~) as unreserved. They carry no reserved syntactic meaning and are guaranteed to pass cleanly across all network routers.
Can percent-encoding protect against XSS or SQL injection?
No. Percent-encoding ensures data passes safely through HTTP network channels and URL parsers. Once a web application decodes the URL parameter, the original characters are restored. Defending against XSS requires context-aware HTML entity escaping.
How does this tool handle multibyte UTF-8 characters?
The tool converts non-ASCII characters into their raw UTF-8 byte sequences before encoding. Each byte is represented by a separate percent-encoded triplet, ensuring full compatibility with international alphabets and emojis.
Is my URL data processed privately?
Yes. All encoding and decoding execute 100% locally inside your browser's runtime memory using JavaScript. No URLs, query strings, or sensitive API parameters are ever transmitted to a server or saved in a database.