URI Component Encoder
URI Component Encoder treats the entire input as data and applies encodeURIComponent. It escapes URL structure characters such as slash, question mark, ampersand, equals, and hash while leaving the standard encodeURIComponent unescaped set. Use it for an individual query value or path segment before assembly, not for an already formed full URL.
Runs locally — files stay on your deviceWhy are slashes and ampersands encoded?
Because a component encoder treats them as data rather than URL delimiters.
A component must not accidentally create structure
Percent triplets represent UTF-8 bytes. Escaping reserved delimiters prevents component data from being parsed as another path segment or query field.
How it works
JavaScript encodeURIComponent converts the complete string, throwing on malformed UTF-16 such as a lone surrogate.
Key concepts
Component boundary
Encode each data value before concatenating URL separators.
Not form encoding
Spaces become %20, not plus.
When to use it
- Encode a dynamic query parameter value.
- Encode one path segment.
- Protect data containing &, =, #, or / from becoming delimiters.
When not to use it
- Do not encode a complete assembled URL.
- Do not call it encryption.
- Do not apply it twice without intending % to become %25.
Worked examples
Query value
- Input
green tea & mint- Expected output
green%20tea%20%26%20mint
Ampersand cannot start another parameter.
Path data
- Input
a/b- Expected output
a%2Fb
The slash remains inside one segment.
Full URL mistake
- Input
https://example.com/a- Expected output
https%3A%2F%2Fexample.com%2Fa
Structure is escaped.
Common mistakes
Encoding the whole URL
Scheme and slashes disappear as syntax. Correction: Use URL Encoder for a formed URL.
Double encoding
% becomes %25. Correction: Track whether the value is already encoded.
Expecting plus for spaces
That is form-urlencoded behavior. Correction: Use the destination's form encoder when required.
Best practices
- Encode dynamic values separately.
- Assemble delimiters only after encoding.
- Never place secrets in URLs merely because they are encoded.
Related operations and differences
URI Component Decoder
Choose URI Component Decoder when you need to decode a percent-encoded URL component.; use URI Component Encoder specifically for url component encode.
Base64 Decoder
Choose Base64 Decoder when you need to decode Base64 into readable text.; use URI Component Encoder specifically for url component encode.
Base64 Encoder
Choose Base64 Encoder when you need to encode text as Base64 in your browser.; use URI Component Encoder specifically for url component encode.
Binary to Text
Choose Binary to Text when you need to decode 8-bit binary groups into text.; use URI Component Encoder specifically for url component encode.
Hex to Text
Choose Hex to Text when you need to decode hexadecimal bytes into text.; use URI Component Encoder specifically for url component encode.
HTML Escape
Choose HTML Escape when you need to escape HTML-sensitive characters.; use URI Component Encoder specifically for url component encode.
Limitations and privacy
- No URL parsing, form-urlencoded mode, Base64url mode, reachability check, or double-encoding detection.
- Lone UTF-16 surrogates throw.
The entered value is transformed locally in this browser and is not sent to the Toolbox server.
Copying or pasting sensitive output into another service is a separate disclosure decision.
Frequently asked questions
Are slashes escaped?
Yes.
Does a space become plus?
No, it becomes %20.
Should I encode the scheme?
No.
Is output confidential?
No.