URL Encoder & Decoder

Percent-encode or decode URLs and query values with encodeURIComponent (component) or encodeURI (full URL)—auto-convert, swap, and parse decoded links locally.

Loading tool…

By Muhammad Abdullah Rauf · Founder, EverydayTools.proUpdated 2026-05-20· Reviewed by EverydayTools Editorial Team

What is a URL encoder / decoder?

A URL encoder converts text into percent-encoded form (%XX) so reserved characters do not break URL structure; a decoder reverses those sequences back to plain text.

Percent-encoding (RFC 3986) represents bytes of a UTF-8-encoded character as % followed by two uppercase or lowercase hex digits. It is required whenever a character would otherwise be interpreted as syntax (e.g. & between query params) or is outside the unreserved set.

JavaScript exposes encodeURIComponent for arbitrary components (aggressive encoding) and encodeURI for full URI strings (preserves :, /, ?, # delimiters). decodeURIComponent and decodeURI are the inverses when strings are well-formed.

Encode parameter values with encodeURIComponent in application code; use this page to preview the same transforms offline.

Quick answers

Concise answers for common searches — definitions, steps, and comparisons.

What is the difference between encodeURIComponent and encodeURI in JavaScript?

encodeURIComponent encodes everything except unreserved characters (A–Z a–z 0–9 - _ . ~), making it suitable for encoding a single query parameter value or path segment. It encodes: & → %26, = → %3D, / → %2F, + → %2B, ? → %3F, # → %23. encodeURI encodes the same characters but preserves structural URL characters (: / ? # [ ] @ ! $ & ' ( ) * + , ; =) so the result remains a valid URL. Rule: use encodeURIComponent for parameter values — encodeURIComponent('hello world & page=2') → 'hello%20world%20%26%20page%3D2'. Use encodeURI only to lightly sanitize a complete URL string you already control.

How do you detect and fix double-encoding in a URL?

Double-encoding happens when already-encoded text is encoded again — %20 becomes %2520 (the % is encoded as %25). Detection: look for %25 followed by two hex digits (e.g., %2520, %2526, %253D). These are % signs that were themselves percent-encoded, indicating the input was already encoded before being passed to an encoder. Fix: decode the string once before encoding, or check if the input contains % followed by two hex digits and skip encoding in that case. In JavaScript: if (/%[0-9A-F]{2}/i.test(input)) { /* already encoded */ } to detect before blindly encoding again.

How should redirect_uri be percent-encoded in OAuth 2.0 authorization requests?

In OAuth 2.0 authorization requests, the redirect_uri parameter value must be percent-encoded when included as a query parameter. The full redirect URI (including its own query string) must be encoded with encodeURIComponent. Example: redirect_uri=https://app.example.com/callback?state=xyz becomes redirect_uri=https%3A%2F%2Fapp.example.com%2Fcallback%3Fstate%3Dxyz. Common mistakes: (1) encoding only the domain but not the path and query string, (2) using encodeURI instead of encodeURIComponent and leaving ? and = unencoded, (3) double-encoding if the HTTP client library also encodes parameters. The redirect_uri value in the token exchange request must exactly match the encoded form registered with the authorization server.

When must plus sign (+) be decoded as space in query strings?

application/x-www-form-urlencoded (HTML form POST bodies and some server parsers) treats + as space. RFC 3986 query strings in modern APIs use %20 for space and treat + as literal plus. decodeURIComponent does not convert + to space. Symptom: OAuth state or search terms show plus instead of space after decode — the data came from form encoding. Fix: replace + with %20 before decodeURIComponent, or use URLSearchParams which handles form semantics. encodeURIComponent encodes space as %20, never + — correct for building OAuth query strings in JavaScript.

How to use URL Encoder & Decoder

  1. Pick encode or decode and scope

    Choose Encode or Decode. Use Component when transforming one value (search text, token). Use Full URL when you need to lightly encode an entire href while keeping / and ? meaningful.

  2. Paste input

    Paste the plain string to encode or the percent-encoded string to decode. Auto-convert runs after you pause typing unless you disable it.

  3. Review output and parsed parts

    Check the output panel for percent-encoded or decoded text. When decoding a full URL, inspect protocol, host, path, and query in the parsed breakdown.

  4. Copy or swap

    Copy the result to your clipboard, or swap input/output to chain encode→decode operations before pasting into code or OAuth settings.

Who uses URL Encoder & Decoder?

Common real-world scenarios where this tool saves time.

Query string encoding

Encode user-submitted search terms, names, or addresses before appending them to a URL to prevent injection and parsing errors.

Debugging redirect URLs

Decode percent-encoded redirect_uri or callback parameters in OAuth flows to verify they point to the correct destination.

API endpoint construction

Encode path segments and query parameters when building URLs programmatically for REST API calls.

Reading analytics URLs

Decode complex UTM-tagged or tracking URLs to understand campaign parameters without manual parsing.

Workflow guides

Step-by-step chains that connect related tools for common tasks.

Decode → inspect OAuth redirect_uri → verify token

  1. Paste the percent-encoded redirect_uri or callback URL here and decode it to read the plain-text destination.
  2. If the decoded URL contains a token parameter, paste the token into JWT Decoder to inspect claims and check the exp timestamp.

Encode credentials → build API request URL

  1. Encode the username:password pair using Base64 Encoder/Decoder to produce the value for the Authorization: Basic header.
  2. Encode each query parameter value here with encodeURIComponent before appending to the request URL — never use encodeURI for parameter values.

URL Encoder & Decoder examples

Space and reserved characters

Input

hello world & q=1

Output

encodeURIComponent → hello%20world%20%26%20q%3D1

Spaces become %20; & becomes %26; = becomes %3D so the value can sit inside a query string safely.

Decode percent sequences

Input

hello%20world

Output

decodeURIComponent → hello world

%20 is the byte for space in UTF-8; decoding restores the original Unicode text.

JSON query value

Input

{"id":1}

Output

encodeURIComponent → %7B%22id%22%3A1%7D

Curly braces and quotes are reserved; encoding packs the JSON blob into one query value.

How it works

Component mode calls encodeURIComponent / decodeURIComponent on the entire pasted string—appropriate for a single query value or path segment. Full URL mode calls encodeURI / decodeURI so structural slashes and delimiters remain usable in a live link.

Formula

space → %20 · & → %26 · + → %2B (in query values, + may mean space in application/x-www-form-urlencoded)

Limitations

  • Double-encoding can happen if you paste already-encoded text and encode again—decode first when unsure.
  • Invalid % sequences (incomplete hex) throw on decode; fix or strip them before decoding.

Reference tables

Percent-encoding reference

Common characters developers encode in query values.

CharacterEncodedNotes
Space%20Also appears as + in application/x-www-form-urlencoded bodies
&%26Must encode when it is data inside a value
=%3DMust encode when it is data inside a value
+%2BLiteral plus in a query value
/%2FOften needed inside a path segment value
?%3FWhen the question mark is literal data

When to use URL Encoder & Decoder vs related tools

Use URL Encoder & Decoder for percent-encoding or decoding strings and query values. Use URL Parser to split an existing URL into parts; use URL Builder to assemble a full link with encoding handled for you.

Related toolUse this tool whenUse related tool when
URL ParserYou need to encode or decode a query value, redirect_uri, or arbitrary text with encodeURIComponent.You already have a complete URL and need protocol, host, path, query keys, and hash broken out.
URL BuilderYou want the raw encode/decode primitive, swap I/O, or to inspect double-encoding.You are building a full URL from host, path, and parameters with encoding applied automatically.
Base64 EncoderThe task is percent-encoding (%20, %26) for URLs and query strings.You need Base64 for Basic auth headers or binary-safe text—not URL percent encoding.
HTML Entity EncoderCharacters must be safe inside a URL or OAuth redirect parameter.Characters must appear safely inside HTML markup (<, & entities).

Best practices

Always use encodeURIComponent for query parameter values

encodeURI leaves & and = unencoded, which breaks multi-value query strings. Encode each value with encodeURIComponent separately, then join key=value pairs with & to construct the query string.

Decode for display, encode for transmission

Display decoded URLs to users so they see readable text. Always re-encode when constructing URLs programmatically. Never pass a decoded URL as a redirect_uri or callback parameter without re-encoding.

Handle + vs %20 based on context

In query strings from HTML forms, + means space (application/x-www-form-urlencoded). In URL path segments and modern APIs, %20 means space and + is a literal plus. Normalize based on the source of your data.

Validate decoded output before use

Decoding a URL from an untrusted source (redirect_uri, user input) can expose open redirect vulnerabilities. After decoding, validate that the resulting URL matches an allowed pattern before using it in a redirect or API call.

Encode once, decode once

Each encode/decode pass should be a single round-trip. Encoding twice produces double-encoded strings that are valid but incorrect. If unsure whether input is already encoded, decode first then re-encode from the plain text.

Common mistakes to avoid

Calling encodeURI on a single query value

encodeURI leaves & and = unencoded; those break values. Use encodeURIComponent for each value, then join with &.

Encoding an entire URL with encodeURIComponent

You will encode slashes and colons—use Full URL (encodeURI) or encode only the pieces that are data.

Mixing + with %20 semantics

HTML forms may send spaces as +; decodeURIComponent treats + as +, not space—normalize based on your source.

Troubleshooting

Double-encoded output (%2520 instead of %20)

Fix:

decodeURIComponent throws 'malformed URI sequence'

Fix:

Spaces decoded as + instead of %20

Fix:

Non-ASCII characters produce unexpected percent sequences

Fix:

Encoded URL is rejected by server as invalid

Fix:

Advertisement

Frequently Asked Questions

What is URL encoding in the context of URL Encoder & Decoder?

URL encoding (percent-encoding) replaces characters that are not allowed in URLs — like spaces, ampersands, and special symbols — with a % followed by their hexadecimal code. For example, a space becomes %20. It is defined in RFC 3986.

encodeURI vs encodeURIComponent?

encodeURIComponent encodes almost everything except A–Z a–z 0–9 - _ . ~ — use it for query values. encodeURI targets full URI strings and preserves characters that structure URLs (/, ?, :, #, etc.).

Should I encode the full URL or just the query string?

Encode individual query parameter values, not the full URL. Encoding the full URL with the wrong API can also encode the protocol (://), slashes, and domain — making it invalid. Encode only the values after the = sign.

Why does %20 sometimes appear as + in URLs?

HTML forms submit data as application/x-www-form-urlencoded, which uses + to represent spaces in the request body. In URL path segments and RFC 3986-compliant query strings, spaces are %20 and + means a literal plus sign. Use %20 in URLs you construct in code; decode + as space only when processing HTML form submissions.

What characters must always be percent-encoded in a URL?

Characters outside the unreserved set (A–Z, a–z, 0–9, -, _, ., ~) must be encoded when they appear as data rather than syntax. Key characters: space (%20), & (%26), = (%3D), + (%2B), ? (%3F), # (%23), / (%2F), : (%3A). encodeURIComponent handles all of these automatically.

What is percent encoding?

Percent encoding (URL encoding) is the RFC 3986 scheme where each byte of a UTF-8 character is written as % followed by two hexadecimal digits—e.g. space → %20, ampersand → %26. It is the same mechanism browsers and JavaScript encodeURIComponent use so reserved characters are not mistaken for URL syntax.

Is URL encoding good for SEO?

Search engines prefer clean, readable URLs in sitemaps and canonical tags—avoid encoding the entire path when plain ASCII works. Encoding still matters for UTM and analytics query parameters: encode each value with encodeURIComponent so & and = inside campaign names do not break parsing. Over-encoding visible slugs (%20 in paths users see) hurts readability; encode only the dynamic pieces.

Is it safe to decode URLs from emails or redirects?

Decoding is safe for inspection, but never trust a decoded redirect_uri or link from email without validating the destination host and path against an allowlist. Attackers hide open redirects behind percent-encoded URLs. Decode to debug, then confirm the plain URL matches your registered callback before using it in production redirects.

What is the difference between encodeURI and encodeURIComponent in JavaScript?

encodeURIComponent encodes all characters except unreserved characters (A–Z, a–z, 0–9, -, _, ., ~). It encodes structural URL characters like /, ?, &, =, :, # — making it safe for encoding a single query parameter value. encodeURI preserves structural characters so the result remains a valid URL. Rule: use encodeURIComponent for query values (utm_source=google+ads → utm_source=google%2Bads). Use encodeURI only when lightly sanitizing a complete URL you already control.

How do I encode a space in a URL?

Use %20 for a space in any URL you build in code. encodeURIComponent('hello world') → 'hello%20world'. Some older systems and HTML forms use + to represent a space in application/x-www-form-urlencoded form bodies, but %20 is the RFC 3986 standard for URLs. When in doubt, use encodeURIComponent which always produces %20, never +.

Why are special characters encoded in URLs?

URLs can only contain a safe subset of ASCII characters. Characters like &, =, ?, #, /, and space have reserved meanings as URL syntax delimiters. If they appear in data values, they must be encoded as %HH sequences so parsers don't mistake them for URL structure. For example, a query value containing & would break the parameter list without encoding: ?name=Tom&Jerry becomes ?name=Tom%26Jerry.

What does %20 mean in a URL?

%20 is the percent-encoded representation of a space character. In percent-encoding (RFC 3986), each unsafe byte is written as % followed by its two-digit hexadecimal value. Space is ASCII 0x20, hence %20. When you see %20 in a URL, you can safely replace it with a space when displaying the URL to humans. Common codes: %20 = space, %26 = &, %3D = =, %3F = ?, %2F = /, %23 = #.

Privacy, accuracy, and trust

Privacy

All URL encoding and decoding runs locally in your browser using native encodeURIComponent / decodeURIComponent—never uploaded to a server.

Accuracy

Output matches JavaScript's built-in encode/decode APIs—the same strings your application code would produce.

For development and debugging—validate redirect URIs and untrusted URLs before use in production redirects.

Advertisement

Reviewed by EverydayTools Editorial Team on 2026-05-20.