URL Encode Online — Free Percent Encoder

Percent-encode any string for safe use in URL components per RFC 3986. Encode spaces, ampersands, query separators, and Unicode — instantly, 100% in your browser.

What is URL Encoding?

URL encoding — also called percent-encoding — replaces every byte outside the unreserved set with a percent sign and two hexadecimal digits. It is defined by RFC 3986 and is the only legal way to embed reserved or non-ASCII characters inside a URL component. Spaces become %20, ampersands become %26, and Unicode characters expand to multi-byte UTF-8 percent sequences.

Without it, a URL containing a space, an ampersand, or a question mark inside a value would be misinterpreted as URL structure. The OpenFormatter URL encoder runs entirely in your browser using encodeURIComponent and never uploads your input.

How to URL encode online — 4 steps

  1. Paste your string. The Input panel accepts any text — a search term, file name, JSON value, full sentence, or Unicode block.
  2. Click Encode. The tool calls encodeURIComponent client-side and returns a percent-encoded string.
  3. Inspect the output. Reserved characters and Unicode bytes are now %XX sequences. Unreserved characters (letters, digits, - _ . ~) are unchanged.
  4. Copy and embed. Click Copy and paste the result into your URL after the parameter equals sign.

Side-by-side example

Raw input

hello world & friends
search?q=café
{"id":42,"name":"O'Reilly"}

Percent-encoded

hello%20world%20%26%20friends
search%3Fq%3Dcaf%C3%A9
%7B%22id%22%3A42%2C%22name%22%3A%22O%27Reilly%22%7D

RFC 3986 Compliant

Encodes every byte outside the unreserved set (A-Z a-z 0-9 - _ . ~) to its %XX percent-encoded equivalent — the exact rule defined in RFC 3986.

UTF-8 Multi-Byte

Unicode characters expand to their UTF-8 byte sequence first, then each byte is encoded. Emoji, CJK, and accented Latin all round-trip cleanly.

Client-Side Only

Encoding runs in JavaScript inside your browser. Tokens, signed URLs, and PII never reach a server. Verify in DevTools → Network.

Common use cases

  • check_circleEncoding query parameter values before appending to a URL (?q=hello%20world)
  • check_circlePercent-encoding user-supplied search terms for URL construction
  • check_circleEncoding special characters in REST API endpoint path segments
  • check_circlePreparing email addresses for mailto: links and OAuth redirect URIs
  • check_circleEncoding spaces and symbols in <a href> attributes generated server-side
  • check_circleEncoding JSON payloads as a URL query parameter for analytics events
  • check_circleBuilding safe deep-links for mobile apps with embedded user data
  • check_circleEncoding Unicode file names for HTTP Content-Disposition headers

encodeURI vs encodeURIComponent — pick the right one

JavaScript ships two URL encoders. encodeURI assumes you are encoding a complete URL and leaves structural delimiters (: / ? & #) alone. encodeURIComponent assumes you are encoding a single component value and escapes those delimiters too. This tool uses encodeURIComponent because component encoding is what you almost always need — encoding a full URL with encodeURIComponent would break its structure, and encoding a value with encodeURI would leave & intact and corrupt the query string.

Need to decode instead?

Reverse percent-encoding back to readable text, or chain with our other escape tools — all browser-side.

Frequently Asked Questions

What does URL encoding actually do at the byte level?

URL encoding takes each character outside the unreserved set (A-Z, a-z, 0-9, hyphen, underscore, period, tilde), converts it to its UTF-8 byte sequence, and replaces every byte with a percent sign followed by two uppercase hexadecimal digits. A single ASCII character maps to one %XX, and a Unicode character like the euro sign € maps to three: %E2%82%AC.

Why does this tool use encodeURIComponent and not encodeURI?

encodeURIComponent encodes a single URL component value — what you would put after q= in a query string. encodeURI is for full URLs and intentionally leaves /, ?, &, # unencoded so the URL stays parseable. If you paste a value that should become safe inside a parameter, encodeURIComponent is the right call. Encoding a whole URL with encodeURIComponent breaks its structure.

Is %20 different from + when encoding a space?

%20 is the RFC 3986 percent-encoding for a space and works in any URL context. The + character represents a space only inside application/x-www-form-urlencoded form bodies and the query component on some servers. This tool emits %20 to stay portable. Servers that accept form-encoded query strings will decode either, but reverse-proxy code paths that use the URL standard expect %20.

How do I avoid double encoding?

Double encoding happens when you re-encode a value that already contains %XX sequences — every percent sign itself becomes %25, so %20 turns into %2520. Always decode first if you are unsure. A safe rule: encode raw user input once on the way into the URL, never again. If you receive a value from a router that already decoded it, you encode that decoded form once.

Which characters are never encoded?

The unreserved set: uppercase A-Z, lowercase a-z, digits 0-9, hyphen (-), underscore (_), period (.), and tilde (~). These 66 characters survive encoding unchanged because they are guaranteed safe inside any URL component.

Does this tool send my input to a server?

No. Encoding happens in JavaScript inside your browser — open DevTools, switch to the Network tab, and click Run. No request leaves the page. This matters when the value contains tokens, signed URLs, or PII.

How are emoji and non-Latin scripts handled?

Each character is converted to its UTF-8 byte sequence, then each byte is percent-encoded. So 你 becomes %E4%BD%A0 and the rocket emoji becomes %F0%9F%9A%80 (four bytes). The output is always plain ASCII safe for any URL.

Why do I sometimes see + instead of %20 in browser address bars?

Browsers that submit a GET form with method="GET" use application/x-www-form-urlencoded, which converts spaces to + in the query string. The same browser will display %20 if you build the URL via JavaScript with encodeURIComponent. Both decode back to a space, but mixing them in the same URL is a frequent source of subtle bugs — pick one convention.

URL Encode Online — Free Percent Encoder | OpenFormatter