URL encode and decode

Why URLs need encoding

A URL can only contain a limited set of characters, and a handful of those — /, ?, &, =, # — carry structural meaning: they separate the path, start the query string, divide parameters, and mark the fragment. So when a value you want to put inside a URL contains one of those characters, or a space, an accent or an emoji, it has to be escaped — otherwise the value would be misread as structure and break the link. Percent-encoding solves this by replacing each offending byte with a % followed by its two-digit hex code: a space becomes %20, an ampersand %26. This is the everyday job behind building query strings by hand, debugging redirect chains, and passing structured data through a URL.

Reserved, unreserved, and UTF-8

The standard (RFC 3986) splits characters into groups. The unreserved set — letters, digits and - _ . ~ — is always safe and is never touched. Reserved characters are the structural delimiters above; they're left alone when they're acting as structure and escaped when they're part of a value. Everything else is escaped. For characters beyond ASCII, the text is first converted to its UTF-8 bytes and each byte is encoded separately, which is why a single accented letter or emoji can expand into several percent-escapes — and why decoding has to reassemble those bytes to recover the original character.

encodeURIComponent vs. encodeURI, and the classic pitfalls

The most common mistake is using the wrong encoder. encodeURIComponent — what this tool uses — escapes the reserved delimiters too, so it is correct for a single piece of a URL, like one query-parameter value. encodeURI preserves the delimiters and is meant for an entire URL you don't want to dismantle. Encode each value with the component encoder, then assemble the URL from the pieces. Two other traps to watch: double-encoding (running an already-encoded string through again turns %20 into %2520 — encode exactly once), and the +-versus-%20 ambiguity, where + means a space in a query string but a literal plus in a path. When in doubt, encode spaces as %20.

Encoding is not the same as encrypting

Percent-encoding only makes text transport-safe; it hides nothing and anyone can decode it instantly, so never rely on it to protect a value in a URL. It also runs entirely in your browser here — nothing is uploaded. URL encoding sits alongside a few related transforms: the Base64 tool makes binary data text-safe, the HTML entity encoder escapes text for HTML rather than URLs, and the UTM builder assembles correctly-encoded campaign links for you. Doing it in code? Our guide to URL encoding in JavaScript explains encodeURIComponent vs encodeURI and the +-versus-%20 trap.