URL Encoder / Decoder

How it works

URLs can only contain a limited set of "safe" characters, so spaces, accents and symbols must be "percent-encoded" — each character is replaced by a % followed by its two-digit hex code, so a space becomes %20, an ampersand becomes %26, and a é becomes %C3%A9. This tool runs those conversions in both directions using your browser's own built-in functions. Everything is processed locally on your device, so nothing you type is uploaded — the result is ready to paste straight into a link, an API call or a query string.

Component vs whole URL

By default the tool encodes a single value. This is the safest choice when you're building one query-string parameter or one path segment, because it escapes every reserved character, including / ? & = #. Tick "Encode whole URL" to preserve those structural characters instead, which is what you want when encoding a complete address that already contains a scheme, a path and a query. Decoding mirrors the same choice, so pick the mode that matches how the value was originally encoded — otherwise %26, for example, will show up as a literal ampersand or stay escaped, depending on which way you went.

How to encode and decode

Type or paste your text into the top box, then press Encode → (or ← Decode) and read the result in the second box. A Copy button puts the output on your clipboard in one click — useful when you're jumping between this page and your code editor. To switch between the two behaviors, tick or clear "Encode whole URL" before pressing a button; the box remembers your last mode. There's no submit button or page reload — every conversion happens the instant you click, so you can iterate quickly.

A concrete example

Say you're building a search link for a results page and the user typed "café crème & croissant". As a raw query string that breaks the URL: the accent isn't allowed and the & would split your parameters in two. Paste the value into the box in component mode, press Encode →, and you get caf%C3%A9%20cr%C3%A8me%20%26%20croissant — one clean, safe parameter. Then tick "Encode whole URL" for the full address https://example.com/search?q=… so the scheme, slashes and ? stay readable instead of being escaped into %3A%2F%2F.

What to expect

The widget works on exactly what's in the box, so the output shapes are precise and predictable. In component mode the encoder escapes every reserved character (; / ? : @ & = + $ , #) plus spaces and non-ASCII letters, while leaving letters, digits and - _ . ! ~ * ' ( ) untouched. In whole-URL mode it keeps the structural characters : / ? & = # literally so a full address stays readable. Decoding is the inverse: it turns %XX sequences back into their real characters. Because it uses your browser's native functions, a malformed sequence — for example a lone % with no hex pair after it — raises an error, which appears as a short red message under the boxes rather than a mangled result.

Common problems and fixes

Decoding failed with "malformed URI"? That means the text contains a % that isn't followed by two valid hex digits — a partial or hand-edited sequence. Fix or remove the stray % and try again.

The slashes in my URL got encoded? You're in component mode, which deliberately escapes them. Tick "Encode whole URL" to keep : / ? & = # intact for a full address.

Decoding shows %26 where I expected &? The string was encoded with encodeURIComponent but you're decoding with the opposite mode, or vice versa. Match the decode mode to how it was encoded.

Copied text looks different from the result? The Copy button copies the current output box exactly as displayed — if neither box has run yet, it mirrors the pre-filled value. Run Encode or Decode once, then copy.

Frequently asked questions