URL Parser
Parse URLs into components, extract query parameters, edit them, and rebuild the URL. 100% client-side.
120 chars
Protocol
https:
Host
codekeet.com
Hostname
codekeet.com
Port
(default)
Pathname
/blog/url-parser
Origin
https://codekeet.com
Hash
#section-1
Username
(none)
🔍 Query Parameters (5)
🔗 Rebuilt URL
https://codekeet.com/blog/url-parser?utm_source=newsletter&utm_medium=email&utm_campaign=launch&page=2&tag=web#section-1
🔒 100% private: All parsing happens in your browser. Your URLs never leave your device.
About URL Parser
A URL (Uniform Resource Locator) is more than just a web address — it contains multiple structured components: the protocol (https://), host (example.com), optional port (:8080), path (/blog/post), query string (?key=value&page=2), and fragment (#section). Query parameters are especially important in modern web development: they carry search queries, pagination, filters, tracking UTMs, authentication tokens, and API arguments. Parsing a URL manually is tedious and error-prone — subtle encoding issues (spaces become %20, & becomes %26) often cause bugs. This tool parses any URL, extracts every component, displays query parameters in an editable table, and lets you rebuild the URL after changes.
How It Works
- Paste any URL into the input box.
- See all components: protocol, host, port, path, hash, and the full query string.
- Query parameters are shown in a table — edit values, add new params, or remove existing ones.
- See the rebuilt URL update live as you make changes.
✨ Key Features
- ✓Parse URL into protocol, host, port, pathname, hash, and query
- ✓Display query parameters in an editable table
- ✓Add, edit, or remove query parameters
- ✓Auto-URL-encode and decode query values
- ✓Rebuild the URL live as you edit
- ✓Handles URLs without protocol (auto-adds https://)
- ✓Handles relative URLs
- ✓Shows raw query string and decoded values
- ✓Copy any component with one click
- ✓100% client-side — no data sent to any server
🎯 Common Use Cases
- →Debugging API endpoint URLs
- →Inspecting UTM tracking parameters on marketing links
- →Extracting query params from redirect URLs
- →Editing test URLs for QA
- →Parsing URLs from logs or error reports
- →Understanding URL structure for SEO
- →Verifying URL encoding of special characters
- →Extracting OAuth callback parameters
💡 Advanced Tips & Pro Insights
- ▸Query parameters are separated by "&" and defined as key=value. Special characters in values must be URL-encoded (space → %20, & → %26, = → %3D).
- ▸The hash (fragment) is not sent to the server — it is used by the browser for in-page navigation. Anything after "#" stays client-side.
- ▸The protocol-relative URL (//example.com/path) inherits the protocol from the current page. This tool assumes https:// when the protocol is missing.
- ▸Duplicate query parameters (e.g., ?tag=a&tag=b) are valid. This tool preserves them in the table.
- ▸For OAuth and analytics, the order and case of parameters matter. This tool preserves original order unless you reorder them.
Frequently Asked Questions
Is this URL parser free?▾
Yes, this URL parser is completely free with no signup, email, or usage limits.
Is my data safe?▾
Yes, 100% safe. All parsing happens in your browser. Your URLs are never sent to any server.
What are the components of a URL?▾
A URL has up to 6 components: protocol (scheme), host (domain), port, path, query string, and fragment (hash). Example: https://example.com:443/blog/post?id=5#section
What are query parameters?▾
Query parameters are key-value pairs at the end of a URL, starting with "?". They are separated by "&". Example: ?search=hello&page=2 contains two params: search=hello and page=2.
Why are some characters shown as %20, %26, %3D?▾
Those are URL-encoded characters. Space (%20), & (%26), = (%3D) must be encoded in query values to avoid conflicting with URL syntax. This tool decodes them for display and re-encodes them when rebuilding.
Can I edit query parameters and get the new URL?▾
Yes. The parameters table is editable — change any value, add a new param, or remove one, and the rebuilt URL updates automatically.
What is the hash (#) in a URL?▾
The hash (or fragment) is the part after "#". It is handled entirely by the browser and is not sent to the server. Common uses: anchor links (#section1) and client-side routing (#/users/5).
What if my URL has no protocol?▾
This tool assumes https:// when the protocol is missing. For example, "example.com/path" is parsed as "https://example.com/path".