URL Parser & Query String Builder

Break a URL down into its parts, or build a query string from key-value pairs.

Protocolhttps:
Hostexample.com
Port(default)
Pathname/path/to/page
Hash#section
Query parameters
search = hello world
page = 2

What Is the URL Parser & Query String Builder?

This tool has two modes: parsing a URL into its component parts (protocol, host, path, query parameters, hash), or building a properly encoded query string from a list of key-value pairs — both entirely in your browser.

How Is the URL Parser & Query String Builder Calculated?

Parsing uses the browser's built-in URL object, which validates and decomposes a URL the same way a browser does internally. Building uses URLSearchParams, which automatically percent-encodes special characters (like turning a space into "+" or "%20") so the resulting query string is safe to use in a real URL.

URL Parser & Query String Builder Example

Parsing https://example.com/search?q=hello+world shows a query parameter q with value hello world; building a query string from q = hello world produces q=hello+world.

How to Use the URL Parser & Query String Builder

Step 1

Choose Parse a URL or Build a Query String at the top.

Step 2

To parse: paste a full URL and see its protocol, host, path, query parameters, and hash.

Step 3

To build: optionally enter a base URL, add key-value rows, and copy the generated query string or full URL.

Benefits

  • Decomposes any URL into its parts without writing code.
  • Automatically handles percent-encoding when building a query string, avoiding manual escaping mistakes.
  • Processes everything locally in your browser — URLs are never sent anywhere.

Common URL Parser & Query String Builder Scenarios

Scenario 1

Debugging why a URL with query parameters isn't working as expected.

Scenario 2

Building a correctly encoded query string for an API request or tracking link.

Scenario 3

Checking exactly what parameters a long, messy URL actually contains.

Understanding Your Result

In Parse mode, each row shows one part of the URL exactly as the browser interprets it. In Build mode, the query string is ready to append to any URL after a "?", and the full URL combines your base URL with it automatically.

Tips

  • Include the scheme (https://) when parsing — a bare domain without it won't parse correctly.
  • Leave the base URL blank in Build mode if you only need the query string itself.
  • Values are encoded automatically — you don't need to manually replace spaces or special characters.

Common Mistakes

  • Pasting a URL without a scheme (e.g. "example.com/page" instead of "https://example.com/page") into Parse mode.
  • Manually percent-encoding values before pasting them into Build mode, which double-encodes them.
  • Leaving a row's key blank — blank keys are skipped when building the query string.

Frequently Asked Questions

Is my URL or data sent anywhere?

No, both parsing and building happen locally in your browser using built-in JavaScript URL APIs — nothing is sent to a server.

Why does a space become a + in the query string?

That's standard query string encoding (application/x-www-form-urlencoded) — a + represents a space, and other special characters are percent-encoded.

Can I parse a relative URL like /path?q=1?

No, this tool requires a full, absolute URL including its scheme (like https://) since a relative URL has no fixed host to resolve against.

What if my base URL already has a question mark in it?

The tool detects an existing "?" and appends new parameters with "&" instead of a second "?", so the result stays valid.

What's the difference between a query parameter and a hash fragment?

Query parameters (after the ?) are sent to the server as part of the request, while the hash fragment (after the #) is typically used client-side only and isn't sent to the server.

Can this tool handle URLs with special characters or Unicode?

Yes — non-ASCII and special characters are decoded and displayed properly, and the query string builder mode correctly percent-encodes special characters for you.

Why would I need to build a query string instead of typing it manually?

Manually encoding special characters like spaces, ampersands, or Unicode text is error-prone — the builder mode handles correct encoding automatically from simple key-value pairs.

Does the port number matter when parsing a URL?

Yes — if a URL includes an explicit port (like :8080), it's parsed out separately; if omitted, the browser assumes the default port for that protocol (80 for HTTP, 443 for HTTPS).

What's the difference between encodeURIComponent and encodeURI?

encodeURIComponent encodes nearly all special characters and is used for individual query parameter values, while encodeURI preserves characters valid in a full URL (like / and :) and is used for encoding an entire URL.

Important Information

URLs and query parameters are parsed and built locally in your browser and are never sent to a server.

Last updated: August 1, 2026