URL Parser & Builder

URL / Query

Inspect and manipulate URLs with an interactive 2-way query parameter table. Edit components, toggle query params, and generate clean URLs in real-time.

Target URL
Query Parameters (0)
Active Key Value Del
Parsed URL Components
Protocol
https:
Hostname
-
Port
(default)
Pathname
/
Hash / Anchor Fragment
-
Active URL Output
Active reconstructed URL based on current host, path, and enabled query parameters:

About This Tool

Deconstructs URLs into protocol, hostname, port, pathname, hash anchor, and a full query-parameter table, or rebuilds a complete URL from edited components. Useful for inspecting API endpoints, testing redirect flows, and composing query strings without manual URI escaping.

All operations take place 100% locally in your browser using standard URL and URLSearchParams APIs with zero telemetry or network calls.

Key Features

  • Two-Way Live Synchronization: Editing the raw URL bar or the parameters table recalculates the other instantly.
  • Per-Parameter Toggle: Uncheck any parameter's Active box to drop it from the URL without losing your key and value.
  • Protocol Auto-Detection: Typing a bare domain like example.com/path automatically assumes HTTPS.
  • JSON Parameters Export: Export active key-value query pairs as a clean JSON object for API testing or curl commands.
  • Query String Space Decoding: Correctly handles both plus (+) signs and %20 encoding formats.

Frequently Asked Questions

Does editing the component cards update the URL?
No, Protocol, Hostname, Port, Pathname, and Hash are read-only summaries. Only the URL field and the query parameter table are editable.
What happens if I omit the protocol?
https:// is assumed automatically, so typing example.com/path still parses correctly.
Can I disable a parameter without deleting it?
Yes: uncheck its Active checkbox. The row stays in the table but is dropped from the rebuilt URL and from the JSON export.
How does + get handled in query values?
Per standard query string conventions, a literal + in a value is decoded to a space when the URL is parsed.
What does Copy Params as JSON export?
A flat object built only from enabled parameters with a non-empty key, for example: {"query": "typescript react"}.