What is the difference between encodeURI and encodeURIComponent?

encodeURI is for a complete URL and deliberately preserves the delimiters / ? : @ & = + $ # so the address still parses. encodeURIComponent is for one value inside that URL and escapes those delimiters too. This tool uses the second — use it on parameter values, never on a finished link.

Why is a space sometimes %20 and sometimes +?

They come from different specifications. Percent-encoding (RFC 3986) uses %20 everywhere. The + convention belongs to application/x-www-form-urlencoded, the HTML form-submission format, and is only valid in a query string or form body — never in a path segment, where + means a literal plus.

Do I need to encode a value I am putting in a URL fragment?

Yes, for the same reasons — and with an extra consequence. The fragment is never transmitted to the server, so a stray # inside your value does not just misparse, it silently discards everything after it before the request is even made.

Is percent-encoding a security measure?

No. It is a syntax rule that makes a value survive URL parsing, and it prevents parameter-injection bugs caused by unescaped delimiters. It is not output escaping: a value going into HTML, SQL or a shell needs the escaping appropriate to that context as well.

Which characters can remain unchanged in component encoding?

JavaScript's encodeURIComponent leaves letters, digits, and a small unreserved set such as -, _, ., !, ~, *, single quotes, and parentheses unchanged. URL delimiters such as &, =, ?, /, and # are escaped so they remain data inside one component.

Why does decoding sometimes return an error instead of partial text?

decodeURIComponent rejects malformed percent sequences and byte sequences that are not valid UTF-8. Returning an error is safer than silently guessing, because a partial decode could change a parameter's meaning. Check for a missing hex digit, a stray percent sign, or text encoded with a different character set.

URL Encoder and Decoder Online

Overview

Percent-encode one URL component, not an already assembled address

This page calls encodeURIComponent or decodeURIComponent over the entire input. That is the right operation for a query value, path segment, or fragment value whose delimiters must become data, and the wrong operation for a complete URL whose delimiters must remain structural.

Component encoding

Reserved delimiters inside the input become percent sequences rather than splitting a query or fragment.

Two reversible directions

Encode and Decode share one split view, with Swap available after a valid result.

Stray percent signs fail

Malformed percent sequences are surfaced as an error instead of being silently altered.

Copy or text file

Export encoded-url.txt or decoded-url.txt from the current result.

How it works

Using URL Encoder / Decoder, start to finish

Three steps, in the order the tool above actually takes them.

1
Identify the component
Separate the value from the URL structure before encoding it.
2
Encode or decode
Paste the component, choose the direction, and inspect spaces, delimiters, and Unicode.
3
Reinsert and test
Put the result into the intended path, query, or fragment and let the destination parse the full URL.

Use cases

What people bring here

The jobs this page is usually opened for, and the setting that makes each one quick.

A query parameter value

Encode user-visible search text without letting & or = create new parameters.

Encode the value only, then assemble it with URLSearchParams or the destination's URL builder.

A path-segment identifier

Protect slashes, spaces, and Unicode that belong inside one path segment.

Do not encode the separators between path segments unless they are actually data.

Debugging a received value

Decode percent sequences to see the text an application should receive.

A plus sign is not converted to a space here; that convention belongs to form encoding.

Structure and data need different treatment

encodeURIComponent preserves a value by escaping URL delimiters

The same characters that make a URL work can corrupt a value when they appear inside that value. The correct boundary is therefore the component, not the finished link.

Input scope	Tempting action	Correct handling
Complete URL	Encode the whole address with this page.	Keep : / ? & = and # structural; encode the individual values placed between them.
Query value	Leave & and = readable inside the value.	Encode them so they cannot split or create parameters.
Space	%20 and + are interchangeable everywhere.	This tool uses %20; + as a space is specific to form-style query encoding.
Security context	Percent-encoding makes the value safe for HTML, SQL, or a shell.	Each destination needs its own validation and output encoding after URL parsing.

Complete URL

Encode the whole address with this page.

Keep : / ? & = and # structural; encode the individual values placed between them.

Query value

Leave & and = readable inside the value.

Encode them so they cannot split or create parameters.

Space

%20 and + are interchangeable everywhere.

This tool uses %20; + as a space is specific to form-style query encoding.

Security context

Percent-encoding makes the value safe for HTML, SQL, or a shell.

Each destination needs its own validation and output encoding after URL parsing.

Privacy

Where your work is processed

The component value and result remain local and are not autosaved. Copy and download are explicit browser actions.

Source content stays in the tab

Encoding, parsing, formatting, generation, comparison, and cryptographic operations run in browser code. Form values and uploaded text files are not sent to a processing API.

Inputs are not autosaved

Code, tokens, secrets, URLs, and generated outputs stay in component memory until the page reloads or closes. Split-pane tools remember only the divider percentage for the current tab session.

Clipboard and downloads are explicit

The page reads the clipboard only after a Paste action and writes it only after Copy. A local download is created only when you choose the tool's download control.

One aggregate page view may be counted

The page shell can send the tool slug, never the editor contents or filename. The endpoint is rate-limited using a transient requesting address and is skipped for Do Not Track or Global Privacy Control.

More detail in how processing works and our privacy policy.

Limits

Encoding behavior in this page

The values this tool actually enforces, not a rounded-up version.

Encoder: encodeURIComponent; Applied once to the complete input string.
Decoder: decodeURIComponent; Malformed percent escapes return a visible error.
Space output: %20; No application/x-www-form-urlencoded plus conversion.
URL assembly: Not performed; Use URL or URLSearchParams when building a complete address.

A complete URL needs component-aware assembly

This tool encodes a single component. It cannot take a full URL and escape only the parts that need it, because deciding which ? is a delimiter and which is data requires knowing the intended structure. It also emits %20 for spaces rather than +, so it is not a form-body encoder.

FAQ

URL encoding questions

The ones that actually come up.

Developer tools

Choose a neighboring tool for the next step; each page states its processing and limits up front.

Base64 Encoder / DecoderRound-trip UTF-8 text through standard Base64, with invalid input reported clearly.Open JSON FormatterA full JSON workspace for formatting, repair review, queries, conversion, and comparison.Open JSON Repair ProA repair review for malformed and AI-generated JSON, with a named rule behind every change.Open JSON to TypeScriptInfer TypeScript interfaces from one JSON example, with sampling limits stated.Open CSV to JSON ConverterA full data workspace for parsing, mapping, inspecting, cleaning, and converting tabular data.Open SQL FormatterLay out a query with two-space indentation and dialect-aware keyword handling.Open

Guides

Reading that goes deeper

UTM Parameters Explained: How to Track Your Marketing CampaignsAnalytics can tell you traffic came 'from Facebook' — but not which post or ad. UTM parameters fix that. Here's how the five tags work and how to use them without wrecking your data.Read How QR Codes Work — and How to Use Them WellQR codes are everywhere now, but most are made badly. Here's how they actually work, the static-vs-dynamic decision that trips everyone up, how to design one that always scans, and how to track scans for free.Read URL Encoding Explained: A Practical GuideLearn how percent-encoding works, when to use encodeURIComponent, why spaces become %20 or +, and how to prevent broken links and double encoding.Read