When should I use encodeURIComponent and when encodeURI?

Use encodeURIComponent for a single value you put into a URL — a search term, a parameter value or a path segment. It encodes /, ?, & and = too. Use encodeURI for a complete URL that only needs spaces and non-ASCII characters fixed; it leaves the characters that give a URL its structure alone.

Should spaces be %20 or +?

%20 is correct everywhere in a URL. + means a space only in query strings using HTML form encoding (application/x-www-form-urlencoded). Choose “Space as +” only when the receiving side expects form encoding.

Why are ! ' ( ) and * not encoded?

encodeURIComponent leaves them as they are, since they are allowed in URLs. RFC 3986 reserves them as sub-delimiters, so some APIs (OAuth signatures, for example) require them encoded. Tick “Also encode ! ' ( ) *” for that.

How are emoji and accented letters encoded?

As their UTF-8 bytes, each written as %XX: ü becomes %C3%BC and 👋 becomes %F0%9F%91%8B. Every modern server and browser decodes this correctly.

Is URL encoding the same as Base64?

No. URL encoding only replaces characters that aren’t allowed in a URL, so the text stays readable. Base64 rewrites all data into a 64-character alphabet and is used for binary data, not for making text URL-safe.

URL Encoder

URL encode text for a parameter, or a whole URL, with UTF-8 and form-encoding options.

Text or URL

café au lait & croissants: 100% fresh 👋

Encoded

caf%C3%A9%20au%20lait%20%26%20croissants%3A%20100%25%20fresh%20%F0%9F%91%8B

caf%C3%A9%20au%20lait%20%26%20croissants%3A%20100%25%20fresh%20%F0%9F%91%8B

How to URL-encode text

Type or paste the text or URL on the left.
Choose Component for a single value or Full URL for a complete address, and decide whether spaces should become +.
Copy the encoded result or download it as a text file.

encodeURIComponent vs. encodeURI: which one to use

Both percent-encode spaces and non-ASCII characters as UTF-8. The difference is what they leave alone. encodeURIComponent also encodes / ? # & = : +, so the value can't break the URL around it. encodeURI keeps those characters, because in a full URL they separate the path, query and fragment.

The same input, two encodings

Input:               https://x.test/a b?q=ü&r=1/2
encodeURIComponent:  https%3A%2F%2Fx.test%2Fa%20b%3Fq%3D%C3%BC%26r%3D1%2F2
encodeURI:           https://x.test/a%20b?q=%C3%BC&r=1/2

Rule of thumb: build URLs from parts and encode each value with encodeURIComponent. Use encodeURI only to clean up a whole URL someone typed with spaces or accents in it.

JavaScript

const q = "café & croissants";
const url = `https://shop.example/search?q=${encodeURIComponent(q)}`;
// https://shop.example/search?q=caf%C3%A9%20%26%20croissants

// Or let URLSearchParams do it (uses + for spaces):
new URLSearchParams({ q }).toString(); // "q=caf%C3%A9+%26+croissants"

URL encoding examples

Spaces as %20 and as + (form encoding)

café au lait
→ caf%C3%A9%20au%20lait
→ caf%C3%A9+au+lait

Strict RFC 3986, for OAuth and signed requests

it's (fun)*
→ it%27s%20%28fun%29%2A

Decode and related tools

Check the result with the URL decoder, which also lists query parameters. For binary data or tokens, the Base64 encoder is the better fit, and links you build can be tested in the online HTML editor.

Frequently asked questions

When should I use encodeURIComponent and when encodeURI?: Use encodeURIComponent for a single value you put into a URL — a search term, a parameter value or a path segment. It encodes /, ?, & and = too. Use encodeURI for a complete URL that only needs spaces and non-ASCII characters fixed; it leaves the characters that give a URL its structure alone.
Should spaces be %20 or +?: %20 is correct everywhere in a URL. + means a space only in query strings using HTML form encoding (application/x-www-form-urlencoded). Choose “Space as +” only when the receiving side expects form encoding.
Why are ! ' ( ) and * not encoded?: encodeURIComponent leaves them as they are, since they are allowed in URLs. RFC 3986 reserves them as sub-delimiters, so some APIs (OAuth signatures, for example) require them encoded. Tick “Also encode ! ' ( ) *” for that.
How are emoji and accented letters encoded?: As their UTF-8 bytes, each written as %XX: ü becomes %C3%BC and 👋 becomes %F0%9F%91%8B. Every modern server and browser decodes this correctly.
Is URL encoding the same as Base64?: No. URL encoding only replaces characters that aren’t allowed in a URL, so the text stays readable. Base64 rewrites all data into a 64-character alphabet and is used for binary data, not for making text URL-safe.