URL Encoder_
Type text and watch it become URL-safe: spaces to %20 (or + for forms), ampersands to %26, é to %C3%A9. The changed characters are highlighted in the output and tallied in a legend underneath, so you can see exactly what the encoder did instead of trusting an opaque string — and input that is already encoded triggers a double-encoding warning before you break a link.
Two modes, because there are two jobs: Query value encodes everything unsafe including &, =, and /; Whole URL keeps those structural characters so a complete address stays a working address. Everything encodes in your browser.
Newlines encode as %0A — correct for a value, but split the input into lines first if each line is a separate URL.
—
- Input
- Text destined for a URL — a search phrase, a filename, a redirect target, or a whole address you want made safe to pass around.
- Output
- The percent-encoded text, with a legend naming every character that changed and what it became, so you can check the result instead of trusting it.
- Processing
- Encoded in this tab as you type, per byte of UTF-8 — which is why one accented letter becomes two sequences and an emoji becomes four.
- Limits
- Unreserved characters are never touched: letters, digits, hyphen, full stop, underscore and tilde survive by specification rather than by choice.
- Two modes
- Query value encodes the structure characters too, which is what you want for something going INSIDE a parameter. Whole URL leaves the slashes, question mark and ampersands alone so the address still works.
URL encoding that shows its work
What URL encoding is, and when you actually need it
URLs transport only a limited character set; everything else must travel as percent-codes — % plus the hex of each UTF-8 byte. You need to URL encode online exactly when text crosses into a URL: a search phrase into a query parameter, a return address into a redirect, a filename with spaces into a path. The legend under the output lists each changed character with its code and count, which is this page's answer to the "url encode codes" question — the codes that matter are the ones in your string, tallied live. Encoding and decoding are one round trip across two pages: the URL decoder reverses everything this page produces, sharing the same engine, so url encode and decode is a pair of links, not a mode buried in a menu.
Query value vs whole URL — wrong choice, broken link
Encode https://x.dev/a b?q=1 in Query value mode and the colon, slashes, and question mark all encode too — the "URL" is now an inert string, useful only as a parameter inside another URL. That is precisely what Query value mode is for: values. Whole URL mode (encodeURI semantics) keeps the structural characters — : / ? # & = @ and friends — and encodes only what is genuinely unsafe, like spaces and non-ASCII, so a complete address stays clickable. The rule that prevents both failure modes: encode each piece with Query value mode, assemble the URL from encoded pieces, and reach for Whole URL mode only when you receive a fully-formed address that merely needs its spaces and accents fixed.
The space question: %20 or +
Both encode a space, in different dialects. %20 is RFC 3986 percent-encoding and is correct everywhere — paths, query strings, headers. + carries the space meaning only inside application/x-www-form-urlencoded payloads: HTML form submissions and the query strings browsers write. Use the toggle when your target is a form body or a system known to apply form semantics; leave it off for everything else, and note what the toggle does to real plus signs — with Space as + on, a literal + in your text encodes as %2B, so the round trip stays unambiguous. When in doubt, %20 is never wrong; + in a path is.
Doing this in code: four languages, the same two choices
The two modes on this page map directly onto the standard libraries. JavaScript: encodeURIComponent(value) is Query value, encodeURI(url) is Whole URL. Python: urllib.parse.quote(s) (add safe='' to also encode slashes) and quote_plus(s) for form semantics. PHP: rawurlencode() for %20, urlencode() for +. Java is the trap: URLEncoder.encode(s, "UTF-8") produces form encoding — spaces become + — so for a path or an RFC-correct value you must replace + with %20 afterward, a one-line fix that has shipped as a bug in countless services.
Paste it, choose the mode, check the legend
- 01Type or paste the text — encoding runs on every keystroke, with the changed characters highlighted in the output and tallied in the legend below it.
- 02Choose the mode before copying: Query value for text headed into a parameter, a form field, or one path segment; Whole URL only for a complete address that needs its unsafe characters fixed in place.
- 03Toggle Space as + only when the destination uses form encoding — a form body or a query string consumed by form-semantics code. Literal plus signs encode to %2B either way, so nothing collides.
- 04If the warning says the input already contains percent-sequences, stop and decide: encoding again is correct only if you truly want a doubly-wrapped value. Then Copy, or Download as a text file.
Four things that break a URL, and the fix for each
A URL inside a redirect parameter
The classic: a full address must ride inside next= — Query value mode makes it inert so the outer URL's structure survives.
https://x.dev/cart?item=7&color=red
https%3A%2F%2Fx.dev%2Fcart%3Fitem%3D7%26color%3Dred
A search phrase with structure characters
User input full of & and # would split the query string; encoded, it is one value.
fish & chips #1 (50% off)
fish%20%26%20chips%20%231%20(50%25%20off)
Unicode text in a share link
Accents and emoji expand to multi-byte sequences — the legend shows each character's bytes.
café ☕ naïve
caf%C3%A9%20%E2%98%95%20na%C3%AFve
A filename with spaces in a path
Spaces in download paths need %20 — never +, which in a path is a literal plus.
annual report 2026.pdf
annual%20report%202026.pdf
What encodes in each mode
| Character(s) | Query value | Whole URL | Note |
|---|---|---|---|
| space | %20 (or +) | %20 | The toggle only affects Query value mode |
& · = · ? · # | %26 %3D %3F %23 | unchanged | Reserved: structure in a URL, data in a value |
/ · : · @ | %2F %3A %40 | unchanged | Reserved: path and authority structure |
+ · $ · , · ; | %2B %24 %2C %3B | unchanged | Reserved (sub-delims) |
% | %25 | %25 | Always — it is the escape character itself |
" · < · > · \ · ^ · ` · { } · | | encoded | encoded | Unsafe everywhere |
- _ . ~ letters digits | unchanged | unchanged | The RFC 3986 unreserved set — never needs encoding |
! ' ( ) * | unchanged | unchanged | encodeURIComponent leaves these; strict RFC 3986 encoders escape them |
| é (and all non-ASCII) | %C3%A9 | %C3%A9 | One %XX per UTF-8 byte — 2 to 4 per character |
The middle columns are the whole story of the mode switch: reserved characters are data in a value and structure in a URL, and only you know which one your string is.
Which encoding to use where
| Destination | Use | Why |
|---|---|---|
| Query value (?q=…) | Query value mode | The value must not contain live &, =, or # — they belong to the outer URL |
| Path segment (/files/…) | Query value mode, %20 for spaces | + in a path is a literal plus; / inside a segment must encode |
| Form body (POST) | Query value + Space as + | application/x-www-form-urlencoded is the one context where + is a space |
| Fragment (#…) | Query value mode | Same value rules; fragments never reach the server at all |
| Cookie value | Query value mode | Semicolons and commas are cookie structure — encode them away |
| Redirect parameter (next=, url=) | Query value mode on the WHOLE inner URL | The inner address must arrive as one inert token |
One rule covers five of six rows: encode pieces with Query value mode, then assemble. Whole URL mode is for repairing complete addresses, not for building them.
Habits that keep a link intact
- Encode values, then assemble the URL — never assemble first and encode the whole thing after, or your separators encode with the data.
- Read the legend before copying: if you expected three changes and see nine, the input probably contains invisible characters or smart quotes from a document editor.
- When a link with parameters breaks after pasting somewhere, check whether that system encoded it again — %2526 in a log means your %26 was double-wrapped.
- Keep the toggle off unless the destination is form-encoded; %20 works everywhere, + only in form contexts.
- Watch the length when encoding unicode for systems with limits: every non-ASCII character becomes 2–4 sequences (%C3%A9 is 6 characters for one é).
- For a batch, paste one item per line — each line encodes in place, and the %0A note reminds you the line breaks themselves became sequences if you copy the whole block.
When the link looks fine and breaks anyway
Double encoding breaks links quietly
Run the encoder over text that has already been through it and %20 turns into %2520 — the link works right up until something decodes it once and finds %20 where a space should be. This page warns when the input already contains percent-sequences; in pipelines, establish which layer encodes and let it encode exactly once.
Whole URL mode inside a value ruins the outer query
Whole URL mode deliberately leaves & and = alone — correct for an address, fatal for a value. Put that "encoded" URL after next= and its live ampersands split the outer query string into garbage parameters. Values always get Query value mode, no exceptions.
+ for space in the wrong place
A + in a path or header is a literal plus sign. Form semantics apply to form bodies and query strings read by form-aware code — nowhere else. If you cannot name the consumer, use %20; it has no wrong context.
Encoding the whole URL when one parameter needed it
The impulse when a link breaks is to encode all of it — which either inerts the entire address (Query value) or fixes nothing (Whole URL, if the problem was a & inside a value). Find the one value carrying user data and encode just that.
Unicode multiplies your length
Percent-encoding is per byte: é doubles to 6 characters, 😀 to 12. A 100-character message in accented text can blow past a 255-character column or a 2,000-character URL budget after encoding — check the encoded length in the status line, not the original.
Modes, reserved characters, and what stays untouched
- File handling
- Uploads are read inside the page with the browser File API and are never transmitted; Download writes out what is already in the tab.
- Modes
- Query value (encodeURIComponent semantics — reserved characters encode) and Whole URL (encodeURI semantics — structure preserved)
- Space handling
- %20 by default; Space as + applies form semantics in Query value mode, and literal + encodes to %2B so the round trip is lossless
- Changed-character legend
- Every changed character with its sequence and count, in first-appearance order; changed runs highlighted in the output
- Already-encoded detection
- Input containing %XX triggers the double-encoding warning with a link to the URL decoder — encoding proceeds, but knowingly
- Encoding
- UTF-8 (RFC 3986 / WHATWG): one %XX per byte, so non-ASCII characters expand to 2–4 sequences each
- Errors
- Only unpaired surrogates are unencodable; reported plainly, never silently dropped
- Limits
- Inputs up to 100k characters encode as you type; the display stops at 300k. Copy and Download are unaffected and always carry the complete result.
- Processing
- Everything — encoding, file reads, downloads — happens locally; the network tab stays empty
Questions about percent-encoding a URL
How do I URL-encode in JavaScript or Java?
JavaScript: encodeURIComponent(value) for values, encodeURI(url) for whole addresses — the exact mode switch on this page. Java: URLEncoder.encode(s, "UTF-8") produces form encoding, so spaces come out as +; replace + with %20 afterward when the target is a path or an RFC-correct value.
How do I URL-encode in Python or PHP?
Python: urllib.parse.quote(s) leaves slashes alone by default (pass safe='' to encode them too), quote_plus(s) adds form semantics. PHP: rawurlencode() gives %20 per RFC 3986; urlencode() gives + for forms. Each pair is this page’s toggle, spelled differently.
Should spaces be %20 or +?
%20 is correct everywhere. The plus sign is a space in one context only: data a browser itself wrote as a form submission, whether that lands in a POST body or a query string. Put one in a path and it stays a literal plus character — which is why the toggle exists instead of a silent default.
Should I encode the whole URL or just the parameter?
Encode each piece before assembly — that is what Query value mode is for. Whole URL mode exists for the other situation: a finished address whose spaces or unicode need fixing without touching its structure. Encoding a finished URL in Query value mode inerts it completely, which is only right when it is about to become a parameter itself.
Is URL encoding the same as base64 encoding?
No. Percent-encoding escapes individual unsafe characters and leaves the rest readable; base64 re-encodes the entire byte stream into a different alphabet, growing everything by a third. URL-safe base64 (with - and _) is still base64 — the base64 encoder handles it.
Does my text leave the browser?
No. Redirect targets and signed callback parameters are what people are usually encoding when they land here, and both are worth keeping in one place. The work is JavaScript running in this tab. Every function it calls is covered by a test that stubs fetch and XMLHttpRequest to throw, so a request that slipped in would break the build rather than reach a server — and you can confirm it for yourself by disconnecting and carrying on.