Convert and inspect URLs — percent-encode, decode, format query strings, and validate quickly.
Definition: Percent-encoding (URL encoding) converts characters into a format that can be transmitted over the Internet. Decoding reverses that process.
- Encode full URLs or individual components
- Decode percent-encoded text safely
- Format & pretty-print query parameters
- Validate input and show helpful errors
- Copy, clear, and swap input/output quickly
FAQ
What is the difference between encodeURI and encodeURIComponent?
encodeURI encodes a full URL but preserves characters that are meaningful in a URL (like “:” “/” “?”). encodeURIComponent encodes individual components (like query parameter values) and will encode characters such as “&”, “=” and “/”. Use component mode when encoding form values.
I get a “malformed URI” error when decoding — why?
The input may contain invalid percent-escapes (e.g. “%ZZ”). Use the input editor to remove or correct malformed sequences, or paste the content into the tool and click Decode — the tool will show a helpful error message.
Can I format query strings into key/value pairs?
Yes — use Format Query. The tool will parse the query string and present each key/value on its own line for easier reading.
Is this safe to use with sensitive data?
This is a client-side tool. Unless your page or server logs form fields or traffic, data stays local in your browser. Avoid pasting highly sensitive secrets in public/shared machines.
What browsers are supported?
Modern evergreen browsers (Chrome, Edge, Firefox, Safari) are supported. Copy-to-clipboard uses the Clipboard API; if unavailable, a fallback is used.
What Is URL Encoding and Why Does It Exist?
URL encoding — technically called percent-encoding — is the process of converting characters that are not allowed or have special meaning in a URL into a safe format that can be transmitted reliably across the internet.
URLs can only contain a limited set of characters defined by the RFC 3986 standard: letters (A–Z, a–z), digits (0–9), and a small set of special characters (- _ . ~). Every other character — spaces, ampersands, equals signs, non-Latin letters, symbols — must be encoded before being used in a URL.
The encoding works by replacing each unsafe character with a percent sign followed by its two-digit hexadecimal ASCII code. For example a space becomes %20, an ampersand becomes %26, and the equals sign becomes %3D. This is why URLs with search queries often look like:
Without encoding the space and ampersand, the URL would break because browsers and servers use those characters as delimiters to parse the URL structure.
URL Encoding in Practice — Real Examples
Understanding encoding becomes much clearer with side-by-side examples:
| Original Text | URL Encoded | Why It Needs Encoding |
|---|---|---|
| Hello World | Hello%20World | Space is not allowed in URLs |
| user@email.com | user%40email.com | @ has special meaning in URLs |
| price=100&tax=15 | price%3D100%26tax%3D15 | = and & are URL delimiters |
| café | caf%C3%A9 | Non-ASCII characters need encoding |
| path/to/file | path%2Fto%2Ffile | / is a path separator |
| 50% off | 50%25%20off | % itself must be encoded |
Decoding reverses this process — converting %20 back to a space, %26 back to &, and so on. This is essential when reading incoming URL parameters, webhook payloads, or API responses that contain encoded data.
encodeURI vs encodeURIComponent — When to Use Each
This is the most important practical distinction for developers using URL encoding:
encodeURI is designed for encoding a complete URL. It preserves all characters that have structural meaning in a URL — forward slashes, colons, question marks, hash signs, and ampersands — because removing them would break the URL structure. Use this when you have a full URL and want to make it safe for transmission without changing its structure.
Example: https://example.com/search?q=hello world becomes https://example.com/search?q=hello%20world — only the space is encoded, the URL structure is preserved.
encodeURIComponent is designed for encoding individual components — typically query parameter values or path segments. It encodes everything including characters that are structurally meaningful in URLs like /, ?, &, and =. Use this when encoding a value that will be inserted into a URL rather than encoding the URL itself.
Example: Encoding books & media as a query value gives books%20%26%20media — the ampersand is encoded so it is not mistaken for a query parameter separator.
The practical rule: If you are building a URL and encoding a value that goes inside a query parameter, use encodeURIComponent. If you are encoding a complete URL that someone typed or pasted, use encodeURI.
Common Use Cases by Developer Role
Front-end developers encode user-submitted form values before appending them to URLs, ensuring that special characters in search terms, names, or addresses do not break query strings or cause unexpected behavior.
Back-end developers decode incoming URL parameters from HTTP requests to read the original values that the client submitted. Webhook handlers regularly receive percent-encoded payloads that must be decoded before processing.
SEO professionals use URL encoding to ensure that page URLs containing non-Latin characters — Arabic, Chinese, Cyrillic, accented Latin — are properly encoded for search engine crawling and indexing.
API developers encode authentication tokens, search queries, and filter values when constructing API request URLs, ensuring that special characters in these values do not interfere with URL parsing.
Related Tools
- HTML Encoder/Decoder — Encode and decode HTML entities
- Base64 Encoder — Encode text and files to Base64
- JSON Formatter — Format and validate JSON data
- SHA256 Generator — Generate cryptographic hashes
- SEO Analyzer — Analyze on-page SEO signals