URL Encoder/Decoder

edit_note By Utility Spark Editorial Team

fact_check Reviewed by Senior Editor

verified Reviewed: Jul 28, 2026

update Updated: Jul 28, 2026

commit v2.0.0

schedule 5 min read

URL encoding — formally called percent-encoding — is one of those foundational web concepts that causes recurring confusion precisely because it is usually invisible. When you paste a URL with spaces into a browser, it works. When you type a search query with special characters, the browser handles encoding automatically. But the moment you are constructing URLs programmatically, passing JSON as a query parameter, debugging a webhook that arrived with garbled parameters, or building an API integration where the callback URL itself must be embedded in another URL, you need to deal with percent-encoding manually. The Utility Spark URL Converter handles both directions: encode a raw string to its percent-encoded equivalent where every character that is not URL-safe is replaced by %XX hexadecimal pairs, or decode a percent-encoded string back to its readable form. It also correctly handles the difference between encoding a full URL (where / and ? and # should not be encoded) versus encoding a component like a query parameter value (where all special characters must be encoded). Everything runs in your browser using JavaScript's built-in encodeURI(), encodeURIComponent(), decodeURI(), and decodeURIComponent() functions.

lightbulb When to use this tool

check_circle Encoding a complex string (JSON object, email address, search query with symbols) to safely embed it as a URL query parameter value.
check_circle Decoding a percent-encoded URL received in a webhook, log entry, or API callback to read its actual content.
check_circle Encoding a full callback URL that must be passed as a parameter inside another URL (double-encoding scenario).
check_circle Debugging analytics tracking URLs with UTM parameters where the values contain special characters.
check_circle Preparing a URL for use in an HTTP request header or Authorization value where special characters are not allowed unescaped.

Why use our tool?

Two Encoding Modes — Full URL vs Component

encodeURI() encodes a full URL, leaving structural characters like /, ?, #, &, = intact because they have structural meaning in URLs. encodeURIComponent() encodes an individual component (a query parameter value, a path segment), escaping all special characters including /, ?, #, and &. Using the wrong mode is a common source of bugs — this tool offers both with clear labels explaining when each applies.

Both Directions — Encode and Decode

Toggle between encoding (raw text → percent-encoded) and decoding (percent-encoded → readable text). Decoding uses decodeURI() for full URLs or decodeURIComponent() for individual component values. Both modes handle Unicode characters including Devanagari, Arabic, Chinese, and other non-ASCII scripts by encoding them to their UTF-8 byte sequences.

Handles Unicode — Including Indian Language Scripts

URLs can contain any Unicode character, but they must be percent-encoded for safe HTTP transmission. Hindi words, Tamil text, Arabic characters — all are encoded to their UTF-8 byte sequences when percent-encoded. The tool correctly handles multi-byte characters so encoded Unicode URLs decode back to their original scripts without data loss.

One-Click Copy

Copy the encoded or decoded output in one click. No selecting text, no dragging. The result is immediately ready for pasting into your code editor, browser address bar, API tool, or terminal.

Browser-Native — Zero External Dependencies

URL encoding and decoding uses JavaScript's built-in encodeURI/decodeURI and encodeURIComponent/decodeURIComponent functions. These are part of the JavaScript specification and execute locally in your browser. No external library, no server call.

How it works

Select the mode: 'Encode URL Component' for query parameter values and path segments, 'Encode Full URL' for complete URL strings.

Select the direction: 'Encode' (raw → percent-encoded) or 'Decode' (percent-encoded → raw).

Paste your input string into the text area.

The encoded or decoded result appears instantly in the output area.

Click 'Copy' to copy the result.

Examples

science Encoding a JSON Query Parameter

Use case: Passing a JSON filter object as a URL query parameter
Raw input: {"status":"active","date":"2024-07-28"}
Mode: Encode URL Component
Encoded output: %7B%22status%22%3A%22active%22%2C%22date%22%3A%222024-07-28%22%7D
Usage: /api/orders?filter=%7B%22status%22%3A%22active%22%2C%22date%22...

science Decoding a Webhook Callback URL

Received in log: callback_url=https%3A%2F%2Fmyapp.com%2Fwebook%3Ftoken%3Dabc123
Mode: Decode URL Component
Decoded: https://myapp.com/webhook?token=abc123
Now readable for debugging or configuration

Frequently Asked Questions

What is percent-encoding and which characters need to be encoded? expand_more

Percent-encoding replaces characters that are not safe in URLs with a % followed by their two-digit hexadecimal ASCII code. Characters that must be encoded in query parameter values include: space → %20 (or + in form encoding), ! → %21, # → %23, $ → %24, & → %26, ' → %27, ( → %28, ) → %29, * → %2A, + → %2B, , → %2C, / → %2F, : → %3A, ; → %3B, = → %3D, ? → %3F, @ → %40, [ → %5B, ] → %5D. The unreserved characters (A-Z, a-z, 0-9, -, _, ., ~) are safe and never need encoding.

What is the difference between encodeURI() and encodeURIComponent()? expand_more

encodeURI() is designed for encoding a complete URL. It leaves URL structural characters intact: / (path separator), ? (query start), # (fragment), & and = (parameter separators), and : (scheme separator). Use it when you have a full URL you want to make safe for embedding in HTML or a log. encodeURIComponent() encodes everything except unreserved characters — it encodes /, ?, &, = and all other special characters. Use it when encoding an individual query parameter value or path segment that should be treated as a literal string, not a URL structure.

Why does a space sometimes encode as %20 and sometimes as +? expand_more

There are two different URL encoding standards for spaces. Percent-encoding (RFC 3986) encodes space as %20. HTML form encoding (application/x-www-form-urlencoded, used by HTML forms) encodes space as + (plus sign). Both are valid in their respective contexts. Web servers and frameworks typically handle both. This tool uses standard percent-encoding (%20) which is universally correct for API URLs. The + encoding is specific to HTML form submissions and is less portable in general API contexts.

What does 'double encoding' mean and when does it occur? expand_more

Double encoding occurs when an already-encoded URL gets encoded again. If a callback_url parameter value is https://example.com/path?id=1 and you encode it correctly as https%3A%2F%2Fexample.com%2Fpath%3Fid%3D1, that is correct single encoding. If you then accidentally encode that encoded value again, the % signs themselves get encoded (%25), producing https%253A%252F%252F... — double encoded. When decoded once, you get the encoded form, not the original URL. This is a common bug in API integration code and webhook handlers.