URL Encoder / Decoder
Encode and decode URLs and query strings safely.
URL Encoder / Decoder
What This Tool Does
- URL Encoder/Decoder converts text to URL-safe percent-encoded format and back, essential for web APIs, query strings, and form data.
- Encode special characters for safe transmission in URLs, or decode received encoded strings to inspect actual values.
Usage
- Paste text or encoded URL components into the input.
- Choose to encode (text to percent-encoded) or decode (percent-encoded to text).
- Review the output and copy for use in URLs, API calls, or redirects.
Examples
- Encode callback URLs before embedding in OAuth redirect parameters.
- Decode percent-encoded email addresses from webhook logs to inspect user data.
- Encode API query parameters with special characters (spaces, &, =) for safe transmission.
- Decode URL fragments from error reports to extract original request intent.
Limitations
- Encoding the wrong URL segment can produce invalid request behavior.
- Different systems may treat spaces and plus symbols differently.
Best Practices
- Encode each query key and value separately instead of encoding a full URL string at once.
- Keep canonical URL structure unencoded (scheme, host, path separators) unless your target protocol requires otherwise.
- Normalize URL-safe handling across frontend and backend to avoid double-decoding bugs.
- Validate decoded output before logging or rendering it to reduce injection and parsing surprises.
Common Mistakes
- Double encoding: Encoding already-encoded strings creates double escapes (%2520 instead of %20). Decode once before re-encoding.
- Context confusion: Standard URL encoding differs from form data encoding. % signs in form data must be encoded as %25.
- Partial encoding: Not encoding all necessary characters (e.g., &, =) breaks query strings. Encode each parameter key and value fully.
- Space handling: %20 is standard; + is context-specific (mainly forms). Use %20 unless form context demands +.
- Fragment encoding: URL fragments (#) are often passed with raw characters but may need encoding depending on handler expectations.
Technical Reference Guide
- Percent encoding: Non-ASCII and reserved characters are encoded as %HH where HH is hex. Example: space = %20, & = %26, = = %3D.
- Safe characters: Letters (a-z, A-Z), digits (0-9), and - _ . ~ are not encoded.
- Reserved characters for URLs: : / ? # [ ] @ ! $ & ' ( ) * + , ; = are reserved; context determines if they are encoded.
- Query string encoding: Spaces often use %20 or + (context-dependent). Ampersand (&) separates parameters, so it must be encoded in values.
- Form data encoding: application/x-www-form-urlencoded uses + for spaces and %HH for special chars. Different from standard URL percent-encoding.
- Unicode handling: Characters beyond ASCII are encoded as UTF-8 bytes then percent-encoded. Example: é = %C3%A9 (UTF-8 bytes C3 A9).
Specifications & Standards
FAQ
Should I encode full URLs or only components?
Encode individual query parameters and values, not the scheme or domain. URL structure (http://, ?, &) must remain unencoded.
What about plus signs and spaces?
Spaces encode to %20 by default. Plus (+) is sometimes treated as space in legacy form encoding, but standard URL encoding uses %20.
Can Unicode characters be encoded?
Yes. Unicode is encoded as UTF-8 bytes then percent-encoded. é becomes %C3%A9 (UTF-8 sequence).
Is encoding reversible?
Yes, percent-encoded strings can always be decoded back to original text if encoding was done correctly.
Do I need to encode special characters in URL fragments?
Fragments are often passed with raw characters, but encoding for safety is recommended if values are user-generated.
What characters are truly safe unencoded in URLs?
Safe (unreserved) characters: A-Z, a-z, 0-9, - _ . ~. All other characters including spaces, /, ?, # should be encoded.
Can I encode a query string like name=John & city=New York?
Yes. Encode each value so separators remain valid, for example name=John%20Doe&city=New%20York.
Related Tools
Explore related utilities inside the Web Studio workshop for complementary engineering workflows.
View all Web Studio tools