How to encode a URL query value without breaking the link

Characters such as an ampersand or hash have a structural role in a URL. When those characters are part of a search term or another value, they need encoding so a browser can distinguish the value from the separators.

Encode the component, then assemble the URL

Suppose a search value is “tea & coffee”. Its ampersand should remain part of the value, not begin another parameter. The URL encode/decode tool converts the component to teahttps://onefreeplace.com/tools/20/26%20coffee. A query can then use it as the value in ?q=teahttps://onefreeplace.com/tools/20/26%20coffee.

Do not run a complete URL through component encoding. That would escape its colon, slashes, question mark, and equals sign, turning the whole address into one encoded string. In application code, URL and URLSearchParams can assemble links and handle query values for you; use this page when you need to inspect or convert one component by hand.

Why a plus sign can be confusing

The tool uses the browser’s encodeURIComponent and decodeURIComponent rules, which encode a space as %20. HTML form encoding often uses a plus sign for a space. If your source uses form encoding, a literal plus sign and a space need to be interpreted under that format’s rules. Decoding malformed percent escapes is rejected rather than guessed.

Encoding does not make a link safe

Encoded text is still readable after decoding. Check the destination domain before clicking a link, and validate user input in the receiving application. This tool processes only the text you enter in the browser.