Home/Dev Tools/URL Encoder / Decoder

URL Encoder / Decoder

Convert

Encode and decode URL strings. Handle special characters for safe URLs.

Mode
Scope
Case
Input
Loading editor…
Output
Loading editor…
✨ AI Code Explanation
Mode

What Is URL Encoding (Percent Encoding)?

URL encoding — also called percent encoding — replaces unsafe or reserved characters in a URL with a % sign followed by two hexadecimal digits representing the character's UTF-8 byte value. For example, a space becomes %20, and @ becomes %40. Defined by RFC 3986, percent encoding ensures URLs remain valid across all browsers, servers, and HTTP clients, and prevents characters like &, =, and # from being misinterpreted as URL structure.

URL Encoder & Decoder Online — What This Tool Does

This free URL encoder and decoder converts strings to and from percent-encoded form entirely in your browser. Pick a scope (Param, Full URL, or Form), toggle hex case, and see the result update live. Supports JavaScript's three standard encoding functions — encodeURIComponent, encodeURI, and application/x-www-form-urlencoded. No account, no upload.

How to URL Encode a String — Step by Step

  1. Paste your text or URL into the input pane on the left.
  2. Select Encode mode (default) or Decode to reverse the process.
  3. Choose a scope: Param for query values, Full URL to preserve URL structure, or Form for HTML form data.
  4. Optionally switch hex case between uppercase %2F and lowercase %2f.
  5. The encoded or decoded result appears instantly in the output pane. Click Copy to use it.

Encode Scope Options Explained

  • Param (encodeURIComponent) — Encodes everything except A–Z a–z 0–9 - _ . ! ~ * ' ( ). Use for individual query parameter values: q=hello%20world. This is the most common choice for API calls and dynamic URLs.
  • Full URL (encodeURI) — Preserves structural characters : / ? # & = @ so the URL remains navigable. Use when encoding a complete URL that must stay clickable.
  • Form (application/x-www-form-urlencoded) — Same as Param but spaces become + instead of %20. Required by HTML form submissions and some older APIs.

Common Encoding Errors and How to Fix Them

  • Double encoding — Encoding an already-encoded string produces %2520 instead of %20. Always decode first, then re-encode if needed, or use the Swap button to flip direction.
  • Wrong scope — Using encodeURI on a query value leaves & and = unencoded, breaking the parameter boundary. Use Param scope for values.
  • + vs %20 confusion — Servers that decode application/x-www-form-urlencoded interpret + as a space. Plain URL decoders do not. Use Form scope when submitting HTML forms.
  • Non-UTF-8 input — JavaScript's encodeURIComponent uses UTF-8 by default, which covers all modern text. If your server expects a different encoding (rare), you will need a server-side tool.

+ vs %20 — Which Should You Use?

Both + and %20 represent a space, but in different contexts. %20 is the standard percent-encoded space used in path segments and most modern APIs. + is only valid as a space in the query string under the application/x-www-form-urlencoded encoding scheme. When in doubt, use %20 — it is universally understood.

encodeURIComponent vs encodeURI — Key Differences

encodeURIComponent encodes 82 characters and leaves only the 11 unreserved characters untouched. encodeURI leaves an additional 18 characters (including : / ? # & = + @ $ , ;) untouched so URL structure is preserved. Rule of thumb: use encodeURIComponent for parameter values, and encodeURI for complete URLs.

Tips & Tricks

  • Swap direction instantly — click ⇄ Swap to flip Encode ↔ Decode and move output back to input. Useful for chained operations.
  • Live mode — enable Live to encode/decode as you type. Saves clicks when iterating on test strings.
  • Lowercase hex for compactness — some legacy systems prefer lowercase percent codes (%2f vs %2F). Both are valid per RFC 3986 — pick what your backend expects.
  • Use Param scope for API calls — when building query strings programmatically, always use encodeURIComponent (Param) on each value. Never concatenate raw input into a URL.
  • Cyrillic, emoji, and multi-byte text — UTF-8 multi-byte characters produce multiple percent-encoded triplets. é becomes %C3%A9, not %E9.

Related Tools

  • Base64 Encoder / Decoder — Encode binary data or text in Base64 for use in data URIs and JWT tokens.
  • JWT Decoder — Decode and inspect JSON Web Token headers and payloads (which use Base64URL encoding).
  • Hash Generator — Generate MD5, SHA-256, and other cryptographic hashes from any string.
  • Hex to Text Converter — Convert hex-encoded bytes back to readable text.

Is My Data Sent to a Server?

No. URL encoding and decoding run entirely in your browser using JavaScript's native encodeURIComponent, encodeURI, and decodeURIComponent functions. Your URLs, tokens, query strings, and credentials never leave your device — there is no upload, log, or tracking of the values you encode.