URL Encoder

Runs 100% in your browser

Encode URL components, query values, path segments, form data, or complete URIs locally with UTF-8 percent encoding, + space handling, delimiter preservation, and a URL analyzer.

Developer URL utility

Encode, decode, inspect, and troubleshoot URLs

Choose the right URL operation for query values, path segments, complete URLs, or form-style data. Everything stays in your browser.

Local only

Step 1

Input

Ready

0 charactersUTF-8 browser processing

Step 2

Encoding rules

Component mode

ScopeSpace handlingDecode plus signs

Preserve URL delimiters in complete URINormalize percent escapes to uppercaseShow malformed escape errors

Step 3

Output

Waiting for input

0 charactersNo change measured

Safe for developer workflows

Encoding and decoding run with browser-native UTF-8 URL functions. Nothing is uploaded, stored in localStorage, or sent to a remote decoding service. Do not paste credentials, tokens, or private URLs into any shared computer.

Session only

Recent transformations

Your recent transformations will appear here and disappear when this page closes.

Frequently asked questions

What is URL encoding?

URL encoding, also called percent-encoding, represents characters that have special meaning or are not safe in a URI as a percent sign followed by two hexadecimal digits. A space becomes %20 in a URI or + in form-style query data.

Should I use encodeURI or encodeURIComponent?

Use encodeURIComponent for one value such as a query parameter, path segment, or form field because it escapes URI syntax characters inside the value. Use encodeURI when you are encoding a complete URI and want to preserve separators such as : / ? & and =.

Does URL encoding change spaces to %20 or plus signs?

Both conventions are used. Standard URI component encoding uses %20. application/x-www-form-urlencoded data commonly uses + for spaces. Choose the option that matches the API, form, framework, or server receiving the value.

Can I encode a full URL without breaking its slashes and query separators?

Yes. Choose Complete URI scope with delimiter preservation. The tool keeps the URL structure readable while encoding characters that need escaping. For a single query value, use Component / query value instead so an ampersand or equals sign inside the value cannot be interpreted as URL syntax.

Does this URL encoder support Unicode and emoji?

Yes. Browser-native UTF-8 URL functions encode Unicode text, including accented characters, non-Latin scripts, and emoji, into percent-encoded sequences. Always test the final URL with the target application and server.

What is the difference between URL encoding and HTML encoding?

URL encoding prepares data for a URI or query string. HTML encoding prepares text for safe insertion into HTML markup. They solve different problems — use the HTML Entity Encode tool for HTML text and this tool for URI components.

Why does a plus sign become a space when I decode a URL?

In form-style query encoding, + is commonly used as the representation of a space. Turn off Treat + as spaces when a literal plus sign must remain a plus sign, such as in a token or mathematical expression.

Can I detect malformed percent escapes?

The tool reports malformed escapes when strict validation is enabled. A sequence such as %2 without two hexadecimal digits is incomplete and should be corrected at the source rather than silently guessed.

Is this URL encoder private?

The transformation runs in your browser with native JavaScript URL functions. The page does not send input to a remote encoding API or store transformation history in localStorage. Avoid pasting secrets into any shared or untrusted device.

Can I inspect URL query parameters without sending a request?

Yes. Analyze URL mode parses a complete URL locally and shows the protocol, host, port, path, query parameter count, fragment, search string, and decoded query preview. It does not fetch or visit the URL.

What is URL Encoder?

URL encoding — also called percent-encoding — is the mechanism that makes it safe to include arbitrary characters inside a URL. Every character that has special meaning in a URI (:, /, ?, #, &, =) or that is not allowed in certain positions (spaces, Unicode, <, >, ") must be replaced with a % sign followed by its two-digit hexadecimal UTF-8 byte value. Without correct encoding, a query parameter value containing an & breaks the query string, a path segment containing / creates phantom subdirectories, and non-ASCII text corrupts across servers with different character set defaults.

ToolsSonic's URL Encoder handles four real-world encoding scenarios: Component / query value uses encodeURIComponent — the correct choice for a single parameter value, path segment, or form field. Complete URI uses encodeURI and preserves structural delimiters so a whole URL remains navigable. Form-style query produces application/x-www-form-urlencoded output with spaces as + — the format used by HTML forms and many REST APIs. Path segment mode percent-encodes path-unsafe characters for dynamic URL construction. All transformations run locally with browser-native UTF-8 functions — no server call is ever made.

Common use cases

Encoding a dynamic query parameter value containing spaces, Unicode, or reserved chars before inserting into a fetch URL
Building OAuth redirect_uri and state parameters that must survive round-trips through multiple servers
Percent-encoding a search keyword containing accented characters or emoji for an API query string
Encoding a file path or user-provided slug before appending it to a URL template
Producing form-style application/x-www-form-urlencoded payloads for legacy API endpoints that require + for spaces
Debugging a URL that looks corrupted by checking how each component should be encoded

Why use ToolsSonic's URL Encoder?

Most online URL encoders — urlencoder.org, meyerweb.com/eric/tools/dencoder, and urlencode.net — offer a single input box with one mode and no explanation of which encoding function to use or when. ToolsSonic delivers four scopes, two space-encoding conventions (%20 and +), a live preview that updates as you type, and an Analyze URL mode that parses any URL into its protocol, host, port, path, query parameters, and fragment — all locally without fetching the destination.

encodeURIComponent vs encodeURI — explained inline: This is the question that burns developers when & in a value breaks the whole query string. The scope selector shows the answer directly: Component mode for individual values, Complete URI mode for whole URLs. No Stack Overflow search needed.

Form-style encoding for legacy APIs: Many backend frameworks (Django, Laravel, Ruby on Rails) expect application/x-www-form-urlencoded with spaces as +, not %20. The Form-style scope produces exactly this output — a feature missing from every major competitor.

Privacy you can verify: The encoder uses encodeURIComponent and encodeURI — browser-native functions with zero network calls. Paste an OAuth token or API credential to encode it and confirm in DevTools → Network that nothing is transmitted. Session history stores only text in page memory and disappears when the tab closes.

100% private — runs in your browser Instant — no server round-trip Free forever — no account needed

URL Decoder

Decode percent-encoded URLs and query strings back to readable UTF-8 text — handles %20, +, Unicode escapes, mixed encoding, malformed escape checks, and local URL analysis.