Plain Text

Percent-Encoded

What is the URL Encoder?

Drop a string into the left panel and the right panel shows the percent-encoded version. Under the hood it runs encodeURIComponent, which escapes every character that has special meaning in a URL — spaces become %20, ampersands become %26, the at-sign becomes %40, and so on. This is the encoding you want for query parameter VALUES, path segments, and anywhere a raw string needs to ride along inside a URL without breaking it.

There are two encoding flavours and the difference matters. encodeURIComponent (this page) escapes everything special including ?, #, &, =, and / — because at the value-level, those characters would change what the URL means. encodeURI is more permissive and leaves those structural characters alone, because it expects you to be encoding a whole already-formed URL. MDN spells out the table of reserved characters if you need the gory details. If you are building a whole URL from parts, the URL Builder is what you want, not this page.

The actual encoding rule is from RFC 3986 §2.1: each unsafe byte is written as % followed by two hex digits of its UTF-8 bytes. That is why an emoji like rocket gets four percent triples (it is four UTF-8 bytes), while ASCII like ! stays as one. The WHATWG URL Standard formalizes how modern browsers do this, and Wikipedia's percent-encoding article has a clean reference table if you want to cross-check by hand. Everything happens in your browser. Nothing is uploaded, nothing is logged.

How to Use the URL Encoder

Three steps. The page updates as you type — no Convert button.

Paste your string or click Sample

Type or paste any text into the left panel. Click Sample to load a string with the kinds of characters you actually run into — spaces, ampersands, an email, a percent sign. Example input:

Ava Chen & friends? [email protected]  100% off!

Unicode and emoji work fine — the encoder uses UTF-8 byte sequences, so a Japanese name or an emoji will encode to a multi-byte percent sequence and round-trip cleanly through any standards-compliant decoder.

Read the encoded output

The right panel shows the percent-encoded version. Spaces become %20, & becomes %26, ? becomes %3F, @ becomes %40, % itself becomes %25. Updates as you type.

Copy or download

Click Copy to put the encoded string on your clipboard, or Download to save it as a .txt file. Use Clear on the input panel to start over. To go the other way, hop over to the URL Decoder.

When You'd Actually Use This

Building a query string value by hand

Need to construct ?customer=Ava%20Chen&status=active for a quick curl test or a deep link? Encode each value here and paste it into your URL. Forgetting to encode a value with an & in it (a customer name like "Smith & Co.") is a classic source of mysterious "the API only sees half of my parameter" bugs.

Encoding a redirect target

OAuth flows and SSO redirects pass the destination URL inside a query parameter (e.g. ?return_to=...). That destination URL itself contains :, /, ?, & — every one of which has to be percent-encoded so the outer URL stays well-formed. RFC 6749 §3.1.2 calls this out explicitly for OAuth redirect URIs.

Encoding a path segment with a slash in it

If your REST API has routes like /repos/:owner/:name and the name happens to contain a forward slash (rare but legal in some catalogs), the slash has to encode to %2F or the router will treat it as a path separator. Same logic for filenames with spaces or accents in download URLs.

Sanitizing user input before it touches a URL

Any string going into a URL from an HTML form, a search box, or a CSV import needs to be encoded. Unencoded user input is how you end up with broken links, opening parameter injection vectors, or URLs that work for ASCII users and silently fail for everyone else. OWASP's notes on path traversal are a good reminder of what skipping this step costs.

Common Questions

Should I use encodeURIComponent or encodeURI?

Almost always encodeURIComponent — that is what this page uses. It is the right choice for query parameter values, path segments, and anywhere a string needs to be a "piece" of a URL. encodeURI is for encoding a URL that is already structurally complete (rare in practice — usually you are building from parts). The MDN reference linked above has the full table of which characters each one escapes.

Why is + sometimes used for spaces and sometimes %20?

Two encoding traditions live side by side. application/x-www-form-urlencoded (the ?key=value body of an HTML form submit) uses + for space. The general URL percent-encoding from RFC 3986 uses %20. encodeURIComponent always produces %20. Most servers accept either, but if your downstream decoder is form-strict, swap with .replace(/%20/g, "+") after encoding.

Does it handle emoji and non-ASCII text correctly?

Yes. The encoder serializes the input as UTF-8 first, then percent-encodes each byte. So an emoji becomes a multi-byte percent sequence, and any standards-compliant decoder will round-trip it back. If you are integrating with a system that uses Latin-1 or another legacy encoding, you have a different problem — change the upstream system, do not hand-roll a non-UTF-8 encoder.

What characters does encodeURIComponent NOT encode?

Letters A-Z and a-z, digits 0-9, and the unreserved characters - _ . ! ~ * ' ( ). Everything else gets percent-encoded. The list comes straight from the original spec and is fixed across every modern JavaScript engine — see the ECMAScript spec for encodeURIComponent if you want chapter and verse.

Is the input I paste here sent anywhere?

No. Encoding runs entirely in your browser via the JavaScript engine. There is no network call, no server, no log. Paste secrets, tokens, anything sensitive — it never leaves your machine.

How big a string can I encode here?

There is a 256 KB cap on the input. Real-world URL values are kilobytes at most. If you need to encode several MB of data, you are almost certainly trying to embed a payload in a URL when you should be POSTing a body — encode it server-side and skip the round trip.

Other URL & Encoding Tools

Encoding is one operation. Here's what else pairs naturally with it: