How to Encode and Decode URLs Step by Step
Quick Answer
To URL-encode: paste your text into the URL Encoder, and the percent-encoded string appears instantly. To decode: paste an encoded URL into the URL Decoder, and the original text appears. All processing happens locally in your browser using encodeURIComponent() and decodeURIComponent().
Introduction
URL encoding (also called percent-encoding) converts special characters in a URL into a format that is safe to transmit over the internet. Characters like spaces, quotes, and non-ASCII letters have special meaning in URLs or are not allowed at all. URL encoding replaces them with a percent sign followed by two hex digits (e.g., space becomes %20). This guide shows you how to encode and decode URLs in your browser.
Step by Step
-
Open the URL Encoder/Decoder tool
Go to the URL Encoder & Decoder tool page. The tool has two modes: Encode and Decode.
-
Enter your text or URL
In Encode mode, paste the text or URL you want to encode. This is useful when building query strings with values that contain spaces, special characters, or non-ASCII text.
-
Read the encoded output
The tool encodes your input using encodeURIComponent(). Spaces become %20, special characters like & become %26, and non-ASCII characters are UTF-8 encoded then percent-encoded. The result appears instantly.
-
Copy the encoded URL
Click Copy to copy the encoded string. Use it in your API request, HTML href attribute, or JavaScript fetch() call.
-
Decode an encoded URL
Switch to Decode mode and paste a percent-encoded string. The tool decodes it using decodeURIComponent() and shows the original text. Invalid escape sequences (like %ZZ) produce an error.
Examples
Encode a query string value with space
Input: hello world
Output: hello%20world
Encode a URL with special characters
Input: https://example.com/search?q=foo&bar=baz
Output: https%3A%2F%2Fexample.com%2Fsearch%3Fq%3Dfoo%26bar%3Dbaz
Encode non-ASCII text
Input: café
Output: caf%C3%A9
Decode a percent-encoded URL
Input: hello%20world%20%26%20goodbye
Output: hello world & goodbye
Common Problems
- Encoding the entire URL when only the query parameter values need encoding —encode values, not the structure (://?&=).
- Double-encoding —if a URL is already encoded, encoding it again produces %2520 instead of %20. Decode first if unsure.
- Using encodeURI() vs encodeURIComponent() —encodeURI() keeps URL-structural characters (:/?&=), encodeURIComponent() encodes them. Use the latter for query parameter values.
- Invalid escape sequences in decode —%ZZ or %2 are not valid percent-encoding and will throw an error.
Tips
- Always encode query parameter values that may contain spaces, special characters, or user input to prevent URL injection.
- Use encodeURIComponent() for query parameter values, and encodeURI() for full URLs that just need unsafe characters encoded.
- URL encoding is not encryption —anyone can decode it. Never use it to hide sensitive data.
- Use our URL Encoder and Decoder tools for instant, private processing in your browser.