jsonsql.dev100% client-side
%

URL Encode & Decode

Encode, decode & parse URLs instantly in your browser

Loading URL Encode/Decode tool...

How to URL encode and decode online

jsonsql.dev encodes and decodes URLs instantly in your browser. No data is sent to any server — your text stays on your machine.

Paste your text or URL — enter the string you want to encode or decode into the input editor on the left.

Choose Encode or Decode — select the operation mode. Enable "Full URL mode" to encode an entire URL (preserving structure) or use component encoding for query parameter values.

Copy the result — the output appears instantly on the right. Click Copy to copy it to your clipboard.

Example

Encoding a query parameter value:

Input:  Hello World! How are you? price=$100&tax=10%
Output: Hello%20World!%20How%20are%20you%3F%20price%3D%24100%26tax%3D10%25

Decoding a URL:

Input:  https%3A%2F%2Fexample.com%2Fsearch%3Fq%3Dhello%20world%26lang%3Den
Output: https://example.com/search?q=hello world&lang=en

Parsing a full URL into parts:

URL: https://example.com:8080/api/search?q=hello+world&limit=10#results

Protocol: https:
Host:     example.com:8080
Port:     8080
Path:     /api/search
Query:    ?q=hello+world&limit=10
Fragment: #results

Query Parameters:
  q     = hello+world
  limit = 10

Features

  • Encode text using encodeURIComponent() for safe URL query parameter values
  • Decode percent-encoded strings using decodeURIComponent()
  • Full URL encode option: encode an entire URL with encodeURI(), preserving ://, /, ?, &, =, and #
  • Parse any URL into protocol, host, port, path, query parameters, and fragment
  • Query string builder: add key-value pairs and generate an encoded query string
  • Common encoded characters reference table
  • Batch mode: encode or decode multiple lines at once
  • Dark and light theme support
  • Keyboard shortcut: ⌘+Enter to encode/decode
  • Works offline — no internet needed after the page loads

What is URL encoding (percent-encoding)

URL encoding (percent-encoding) replaces unsafe characters with a percent sign followed by two hexadecimal digits — for example, a space becomes %20. This ensures URLs are transmitted correctly across all systems.

The standard is defined in RFC 3986 (Uniform Resource Identifier: Generic Syntax). URLs can only contain a limited set of characters from the US-ASCII character set. Characters outside this set — including spaces, non-ASCII characters, and characters that have special meaning in URL syntax — must be percent-encoded before they can appear in a URL.

The encoding process works by taking each unsafe character, converting it to one or more bytes (using UTF-8 for non-ASCII characters), and representing each byte as %HH where HH is the two-digit hexadecimal value. For example:

  • Space (ASCII 32) → %20 (32 in hex is 20)
  • Ampersand (ASCII 38) → %26 (38 in hex is 26)
  • e with accent (UTF-8: 0xC3 0xA9) → %C3%A9

RFC 3986 divides characters into two categories:

  • Unreserved characters (never need encoding): A-Z a-z 0-9 - . _ ~
  • Reserved characters (have special meaning in URLs): : / ? # [ ] @ ! $ & ' ( ) * + , ; =

Reserved characters must be percent-encoded when they are used outside their reserved purpose — for example, when a literal & appears inside a query parameter value rather than as a parameter separator.

URL encoding reference table

The following table lists commonly encoded characters, their percent-encoded form, and their ASCII code. Bookmark this page as a quick reference for URL encoding.

CharacterEncodedASCII codeDescription
(space)%20 or +32Space (use %20 in paths, + in query strings)
!%2133Exclamation mark
"%2234Double quote
#%2335Hash / fragment identifier
$%2436Dollar sign
%%2537Percent sign (must always be encoded)
&%2638Ampersand / query parameter separator
+%2B43Plus sign
,%2C44Comma
/%2F47Forward slash / path separator
:%3A58Colon (used in protocol)
;%3B59Semicolon
=%3D61Equals sign / key-value separator
?%3F63Question mark / query string start
@%4064At sign (used in userinfo)
[%5B91Left square bracket
]%5D93Right square bracket
{%7B123Left curly brace
|%7C124Pipe
}%7D125Right curly brace

encodeURI vs encodeURIComponent

Use encodeURIComponent() for query parameter values and encodeURI() for complete URLs. Using the wrong function is the most common URL encoding mistake.

JavaScript provides two built-in functions for URL encoding, and choosing the right one is critical:

FeatureencodeURI()encodeURIComponent()
PurposeEncode a complete URLEncode a URL component (parameter value, path segment)
Preserves: / ? # [ ] @ ! $ & ' ( ) * + , ; =None of the reserved characters
Does not encodeA-Z a-z 0-9 - _ . ~ + reserved charsA-Z a-z 0-9 - _ . ~ ! * ' ( )
Use caseMaking a full URL safe for transportEncoding a value to embed in a URL

Example — encoding a search query:

// CORRECT: encode only the parameter value
const query = 'price > $100 & tax = 10%'
const url = 'https://api.example.com/search?q=' + encodeURIComponent(query)
// Result: https://api.example.com/search?q=price%20%3E%20%24100%20%26%20tax%20%3D%2010%25

// WRONG: encodeURI would NOT encode & and =, breaking the URL
const bad = encodeURI('https://api.example.com/search?q=' + query)
// Result: https://api.example.com/search?q=price%20%3E%20$100%20&%20tax%20=%2010%25
// The & is preserved, creating an unintended second parameter

Rule of thumb: If you are encoding a value that goes inside a URL, use encodeURIComponent(). If you have a complete URL that just needs non-ASCII characters encoded, use encodeURI().

URL structure explained

Understanding URL anatomy helps you know which parts need encoding and which do not. A complete URL follows this structure:

  protocol://userinfo@host:port/path?query=value&key=value#fragment
  \______/   \______/ \__/ \__/ \__/ \___________________/ \______/
   scheme    username  host port path    query string      fragment

Each component has different encoding rules:

  • Protocol/scheme (https:) — never encoded, always lowercase
  • Host (example.com) — internationalized domain names use Punycode, not percent-encoding
  • Port (:8080) — numeric, never encoded
  • Path (/api/search) — each segment is individually encoded; / separators are preserved
  • Query string (?q=hello&limit=10) — keys and values are encoded individually; ?, &, and = are structural and preserved
  • Fragment (#results) — encoded like a path segment; the leading # is preserved

The query string is the most common place where encoding errors occur. Each parameter value must be encoded with encodeURIComponent() to prevent characters like &, =, and # from being interpreted as URL structure.

URL encoding in different programming languages

Every language has built-in functions for URL encoding. Here are the most common ones:

JavaScript:

// Encode a query parameter value
const encoded = encodeURIComponent('hello world & more')
// Result: 'hello%20world%20%26%20more'

// Decode
const decoded = decodeURIComponent('hello%20world%20%26%20more')
// Result: 'hello world & more'

// Build query string with URLSearchParams (auto-encodes)
const params = new URLSearchParams({ q: 'hello world', page: '1' })
params.toString() // 'q=hello+world&page=1'

Python:

from urllib.parse import quote, unquote, urlencode

# Encode a component (like encodeURIComponent)
encoded = quote('hello world & more')
# Result: 'hello%20world%20%26%20more'

# Decode
decoded = unquote('hello%20world%20%26%20more')
# Result: 'hello world & more'

# Build query string
query = urlencode({'q': 'hello world', 'page': '1'})
# Result: 'q=hello+world&page=1'

Java:

import java.net.URLEncoder;
import java.net.URLDecoder;

// Encode (note: uses + for spaces, form-encoded style)
String encoded = URLEncoder.encode("hello world & more", "UTF-8");
// Result: "hello+world+%26+more"

// Decode
String decoded = URLDecoder.decode("hello+world+%26+more", "UTF-8");
// Result: "hello world & more"

PHP:

// urlencode() — uses + for spaces (form-encoded)
echo urlencode('hello world & more');
// Result: hello+world+%26+more

// rawurlencode() — uses %20 for spaces (RFC 3986)
echo rawurlencode('hello world & more');
// Result: hello%20world%20%26%20more

// urldecode() / rawurldecode() for decoding
echo urldecode('hello+world+%26+more');
// Result: hello world & more

Command line:

# Python one-liner
python3 -c "import urllib.parse; print(urllib.parse.quote('hello world & more'))"
# Result: hello%20world%20%26%20more

# Using curl with --data-urlencode
curl -G --data-urlencode "q=hello world & more" https://api.example.com/search

URL Encode/Decode vs other tools

Featurejsonsql.devurlencoder.orgPython urllib
Browser-basedYesYesNo (CLI/code)
Client-side onlyYesNo (server)Yes (local)
URL parserYesNoYes (urlparse)
Query builderYesNoYes (urlencode)
Batch modeYesNoWith scripting
Full URL modeYesPartialYes (quote/quote_plus)
Dark modeYesNoN/A
Works offlineYesNoYes

Related tools

Frequently asked questions

What is the difference between %20 and + for spaces?

Both represent a space character. %20 is standard percent-encoding defined in RFC 3986 and is used in URL paths and modern applications. The + sign is used in the application/x-www-form-urlencoded format, which originated from HTML form submissions. Most modern APIs accept both, but %20 is the safer choice for URL components.

When should I use encodeURI vs encodeURIComponent?

Use encodeURI() when you need to encode a complete URL and want to preserve structural characters like ://?#[]@!$&'()*+,;=. Use encodeURIComponent() when encoding a single value that will be placed inside a URL — such as a query parameter value, a path segment, or a fragment. Using the wrong function is the most common URL encoding mistake.

What is percent-encoding?

Percent-encoding (also called URL encoding) is the mechanism defined in RFC 3986 for encoding characters in URIs. Each unsafe character is replaced with a percent sign (%) followed by two hexadecimal digits representing the character's ASCII or UTF-8 byte value. For example, a space (ASCII 32) becomes %20 because 32 in hexadecimal is 20.

What characters need to be URL encoded?

Any character that is not an unreserved character must be percent-encoded. RFC 3986 defines unreserved characters as A-Z, a-z, 0-9, hyphen (-), period (.), underscore (_), and tilde (~). Reserved characters like :, /, ?, #, [, ], @, !, $, &, ', (, ), *, +, ,, ;, and = must be encoded when used outside their reserved purpose.

Why does my URL break when it contains an ampersand?

The ampersand (&) is a reserved character that separates query parameters in URLs. If your parameter value contains an ampersand (e.g., "Tom & Jerry"), the URL parser treats it as a parameter separator. You must encode it as %26 so the parser knows it's part of the value, not a separator.

How do I encode Unicode characters in URLs?

Unicode characters are first converted to their UTF-8 byte sequence, then each byte is percent-encoded. For example, the emoji character has a multi-byte UTF-8 representation, and each byte becomes a %HH sequence. JavaScript's encodeURIComponent() handles this automatically — you don't need to do the conversion manually.