URL Encoder & Decoder Online — Fix Broken Links Free

What URL encoding actually does

A URL can only carry a limited set of characters safely. Everything else — spaces, special characters, non-Latin letters, emoji — has to be rewritten as percent-encoding: a % followed by the byte value in hexadecimal, so a space becomes %20 and an ampersand becomes %26. This free online tool does that conversion in both directions and adds a third mode that pulls a URL apart. The Encoder turns plain text into a URL-safe string, the Decoder turns percent-encoded text back into readable characters, and Parse URL splits a full address into its protocol, domain, path, fragment, and every query parameter — each field with its own copy button.

Every conversion runs locally in your browser with the built-in encodeURIComponent and decodeURIComponent functions — nothing you paste is uploaded, so it stays fast and private with no signup. Turn on Live Mode to transform as you type, or switch it off for a manual Encode/Decode button. Encoding is UTF-8 aware, so accented letters, non-Latin scripts, and emoji round-trip cleanly and links behave the same across every browser and server. It is the everyday tool developers and SEO specialists reach for when a link breaks — whether you’re building query parameters, debugging an API URL, assembling UTM tracking links, or probing how an app handles an encoded payload during security testing. Pair it with our case converter when you’re normalising a slug, or generate a QR code for the finished link.

Percent-encoding reference table

These are the characters people most often need to look up. Paste any of them into the Encoder and you get the value in the middle column; paste that value into the Decoder to get the character back. This tool encodes at the component level, so every reserved character below is converted — which is exactly what you want inside a single query value.

Anything that is a letter, a digit, or one of - _ . ! ~ * ' ( ) is left untouched — those are the “unreserved” characters that are always safe in a URL, so the Encoder never changes them.

encodeURIComponent vs encodeURI: which one you want

JavaScript ships two encoders, and picking the wrong one is the most common URL-encoding bug. encodeURIComponent encodes a single component — one query value or one path segment — so it also converts the structural characters : / ? # & =. encodeURI encodes a whole address and deliberately leaves that structure intact. This tool’s Encoder uses encodeURIComponent, which is the right default for a value you’re inserting, but it means pasting a complete URL will over-encode the :// and the slashes.

const url = "https://example.com/search?q=blue shoes&sort=price";

encodeURI(url);
// https://example.com/search?q=blue%20shoes&sort=price
// structure ( : / ? & = ) preserved, only the space encoded

encodeURIComponent(url);
// https%3A%2F%2Fexample.com%2Fsearch%3Fq%3Dblue%20shoes%26sort%3Dprice
// everything encoded — correct for ONE value, wrong for a whole URL

// The safe pattern: encode only the value, then build the URL
const q = "blue shoes & red hats";
"https://example.com/search?q=" + encodeURIComponent(q);
// https://example.com/search?q=blue%20shoes%20%26%20red%20hats

Rule of thumb: use the Encoder when you have one value to drop into a query string or path segment. If you have a whole URL that only needs its spaces and unsafe characters fixed, encode the individual pieces — or use the Parse URL tab to split the address first, encode the part that needs it, and reassemble.

Why a space is sometimes %20 and sometimes +

There are two conventions for a space in a query string, and they trip up almost everyone. RFC 3986 percent-encoding — what this tool produces — writes a space as %20. The older application/x-www-form-urlencoded format, which is what an HTML form submits, writes a space as a plus sign. Both are valid, but they are not interchangeable when you decode.

The catch is that decodeURIComponent does not treat + as a space — it leaves the plus exactly where it is. So if you paste form-encoded data into the Decoder, the words stay glued together with pluses:

decodeURIComponent("blue+shoes");    // "blue+shoes"   (+ is NOT turned into a space)
decodeURIComponent("blue%20shoes");  // "blue shoes"   (%20 becomes a space)

// Recover spaces from form-encoded data by swapping + first:
decodeURIComponent("blue+shoes".replace(/\+/g, "%20"));  // "blue shoes"

When you encode, there is no ambiguity: the Encoder always emits %20 for a space and %2B for a literal plus, so a value that genuinely contains a plus — like a phone number starting +1 — survives the round trip.

Common mistakes and how to fix them

Encoding an entire URL when you meant one value

Pasting a full https://… address into the Encoder turns the :// and every slash into %3A%2F%2F. That is encodeURIComponent doing its job on a whole string. Encode only the value going into a parameter, or split the URL with the Parse URL tab first.

Double-encoding

Encoding a string that is already encoded rewrites each % as %25, so %20 becomes %2520. If your output is full of %25, you encoded twice — decode once and check before encoding again.

Expecting the Decoder to turn + into a space

It will not; a plus is only a space under form encoding, not percent-encoding. Replace + with a space (or %20) before decoding data that came from an HTML form.

The Decoder shows “Invalid format for decoding”

decodeURIComponent throws on a stray % or a malformed sequence like %ZZ or a truncated multi-byte character. Look for a lone percent sign or an incomplete %XX pair in your input.

Parse URL says the URL is invalid

The Parse tab needs an absolute address that starts with http:// or https://. A bare path like /search?q=1 has no protocol or domain, so there is nothing to break apart.

Frequently asked questions