Skip to main content

Query strings & UTF-8

URL Encoder & Decoder: Percent-Encode and Decode

Percent-encode text for query strings and URI components (UTF-8), or decode %HH escapes and + to spaces. Runs in your browser with local history.

By Jeff Beem

URL Encoder & Decoder

Turn plain text into percent-encoded strings (for query parameters and URI components), or decode %20-style sequences back to readable text. Uses UTF-8 via encodeURIComponent / decodeURIComponent. + in the input is treated as a space when Decode is selected (common in form data). Choose Encode or Decode above the text areas.

Character count: 0 · UTF-8 size: 0 B

Recent conversions

Last 5 unique conversions appear here. Stored in your browser.

URL Encoder & Decoder: Percent-Encode and Decode Online

URL encode (percent-encode) plain text so it is safe inside query strings, path segments, and other URI components. URL decode turns %20, %C3%A9, and similar escape sequences back into the original characters (UTF-8). This page runs entirely in your browser: nothing is uploaded.

What is URL percent-encoding?

URIs only allow a limited set of characters to appear unescaped. Everything else is written as a percent sign followed by two hex digits: the bytes of the character in UTF-8. A space is often written as %20. HTML forms that use application/x-www-form-urlencoded may send spaces as +; this decoder treats + as a space before decoding, which matches what most developers expect when fixing query strings.

This tool applies the same rules as JavaScript's encodeURIComponent and decodeURIComponent. It is meant for components (a parameter value, a slug fragment you will join into a larger URL), not for blindly double-encoding an already valid full URL. If you need to parse a full URL into scheme, host, path, and query, use a dedicated URL parser (we plan to add one next to this tool).

When should you URL encode text?

Encode when you are building a link or an HTTP request and a value might contain &, ?, #, spaces, or non-ASCII characters. Examples: a search keyword typed by a user, a redirect URL passed as a query parameter, a filename, or JSON crammed into a single query field. Encoding keeps delimiters from breaking the URL and keeps UTF-8 bytes well defined.

Decode when you have copied a query string from the address bar, from server logs, or from an API error message and you want the original text back for editing, display, or debugging.

What this page does at a glance

The Mode control above the boxes picks which transformation runs on the entire Input string. The right column shows the result; Copy output copies that result only.

GoalModeInput should be
Make a value safe to paste into a query stringEncodePlain text (spaces, ?, &, Unicode, etc.)
Turn %… back into readable textDecodePercent-encoded string; + counts as a space
Keep a full browser URL usable Do not run Encode on the whole URL here. Encode each parameter value first, then assemble ? and & between keys yourself, or use a URL parser when we ship one.

Worked examples (try them in the tool)

Paste the Input exactly as shown, set Mode, and compare your Encoded result or Decoded text to the value here.

Example 1 · Spaces and an ampersand

Mode
Encode
Input
latte & croissant
Encoded result
latte%20%26%20croissant

Spaces become %20. The ampersand becomes %26 so it will not break a query string later.

Example 2 · Round-trip

Mode
Decode
Input
latte%20%26%20croissant
Decoded text
latte & croissant

Example 3 · Unicode (UTF-8 bytes)

Mode
Encode
Input
café
Encoded result
caf%C3%A9

The accented letter is two UTF-8 bytes (C3 A9), so you see two percent escapes back to back.

Example 4 · Plus as space (form-style)

Mode
Decode
Input
city=New+York
Decoded text
city=New York

Every + becomes a space before decoding. A literal plus inside a value is usually written as %2B in encoded form.

Example 5 · Double encoding (common mistake)

Step A · Mode Encode, Input
hello world
Output
hello%20world
Step B · Still Mode Encode, paste that output back as Input
hello%20world
New output (note the %25)
hello%2520world

The percent sign itself was encoded as %25. If that was accidental, switch to Decode once to step back, or paste the original plain string again.

Edge cases you will hit in real logs

  • Truncated paste. Copying half of a value from DevTools often leaves a dangling % or only one hex digit. Decode shows the same error panel you would get from decodeURIComponent in the console. Lengthen the selection or remove the broken escape.
  • Invalid hex pair. Strings like %ZZ or %2 at the end fail decoding. Fix the source or re-export the URL from the app that generated it.
  • Already-valid URL in Encode mode. Pasting https://example.com/path?q=1 and choosing Encode escapes the colon and slashes. That output is correct for the rules of this tool, but it is rarely what you want when you were only trying to fix one parameter. Encode the parameter value alone, then splice it into the URL.
  • When you need a literal plus after decoding. Form-style strings use + for space. If the original user meant a real plus sign, the encoded form should carry %2B. Decode a%2Bb to get a+b.
  • UTF-8 that is not valid after decoding. Rare broken sequences can still surface if bytes were corrupted upstream. The tool does not try to repair them; you will see the same decode error until the bytes line up with real UTF-8.

Decode errors you might see

decodeURIComponent throws if a % is not followed by two hex digits, if the bytes are not valid UTF-8, or if the sequence ends mid-byte. Fix the string (often a truncated copy from a log) and try again. If you only wanted to encode a literal percent sign, encode once: 5% off becomes 5%25%20off.

URL Encoder & Decoder FAQ

What is URL encoding (percent-encoding)?

It is a way to write any UTF-8 text using only ASCII: reserved characters and non-ASCII bytes become %HH triplets. Browsers and servers use the same rules when reading query parameters and most URI components.

How do I decode a URL-encoded string?

Paste the encoded string, choose Decode in the mode control above the text areas, then use Copy output below the result when it looks right.

What is double encoding?

Running Encode again on text that already contains % escapes turns each percent into %25. For example, hello%20world becomes hello%2520world. If that was a mistake, switch to Decode once or paste the original plain string and encode a single time.

Why does decoding turn plus (+) into a space?

In application/x-www-form-urlencoded bodies, a plus sign represents a space. This tool applies that rule on decode so pasted query strings behave like typical form data.

Is URL encoding the same as Base64?

No. Percent-encoding keeps text readable for ASCII ranges and only escapes what must be escaped. Base64 re-encodes all bytes into a different alphabet, which is better for binary blobs. Use this page for URL components; use a Base64 tool for binary or opaque payloads.

Can I paste a full https://… URL and encode it?

You can paste it, but Encode will escape the colon and slashes too, which is usually not what you want for an already valid URL. Encode individual values before you concatenate them into a URL. For full URLs, prefer a parser that splits scheme, host, path, and query.

Does this tool send my text to a server?

No. Encoding and decoding run in your browser. Recent results are stored in localStorage on your device only.