What are all the parts of a URL called?

A URL like https://user:pass@host.com:8443/path?q=1#top has, in order: the protocol (https:), optional basic-auth username and password (user / pass), the hostname (host.com), the port (8443), the path (/path), the query string (?q=1) and the hash or fragment (#top). The host field combines hostname and port (host.com:8443), and the origin is protocol + host (https://host.com:8443). This tool labels and shows each one separately.

How do I pull out a single query parameter?

Paste the URL and look at the query parameter table. Each key sits in its own row next to its decoded value, so to read the value of utm_source in ?utm_source=newsletter&page=2 you just find the utm_source row. Hit the copy button on that row to grab the value alone. If you need it in code, URLSearchParams.get('utm_source') returns the same string the table shows.

How are repeated parameters like tag=a&tag=b shown?

Every occurrence gets its own row, in the order it appears in the URL. So ?tag=dev&tag=tools&tag=url produces three separate tag rows reading dev, tools and url. This matters because URLSearchParams.get('tag') in code returns only the first value (dev); to see them all you need getAll('tag'), and this tool shows that full list up front so nothing is hidden.

Can it parse the hash or fragment too?

Yes. The part after the # is shown in its own Hash field, including the # itself, for example #results or #section-2. The browser URL engine does not decode or split the fragment, and neither does this tool, because a fragment can be a plain anchor, a query-like string used by single-page apps, or a JWT, so it is shown verbatim for you to handle as you see fit.

How is this different from just using URLSearchParams?

URLSearchParams only handles the query string, not the protocol, host, port, path or hash, and its get() hides duplicate keys behind the first value. The browser URL object covers the whole URL but you still have to read each property in code. This tool runs both for you, lays every part out at a glance, decodes the query into a readable table including all duplicates, and lets you copy any piece or the full JSON without writing a line.

Does it work on URLs without a scheme, like example.com/path?

No, by design. A bare authority such as example.com/path is technically a relative reference, not an absolute URL, and the browser URL engine rejects it without a base. Rather than silently guessing https://, the parser shows a short note asking you to add a scheme, so the result honestly reflects the string you gave it. Prefix it with https:// and it parses immediately.

Debug a tracking link that is not firing right

A marketing URL comes back with the wrong campaign, and you cannot tell why from the long string. Paste it in and the query table lays out utm_source, utm_medium and utm_campaign each on its own line, decoded. You spot that utm_campaign reads "spring sale" with a raw space instead of an encoded one, or that a stray second utm_source is overriding the first. Two seconds of reading beats squinting at a 200-character link.

Read an OAuth or redirect callback URL

OAuth and SSO flows bounce the user through callback URLs packed with code, state, scope and redirect_uri values, often double-encoded. Drop the callback in to see each parameter decoded and separated, confirm the state matches what you sent, and check that redirect_uri points where you expect. Catching a mismatched redirect_uri here saves a long round of "why is the login loop broken".

Verify an API request URL before you ship it

Before hardcoding an endpoint, paste the full request URL to confirm the host, port, path and every query parameter are exactly right. The path-segment and host-label breakdown make it obvious if you typed /v2//search with a double slash or pointed at staging instead of the production host. Copy the cleaned JSON straight into a test fixture.

Teach how a URL is structured

When explaining the anatomy of a URL to a student or a junior teammate, a labeled live breakdown beats a diagram. Type a real URL, point at the protocol, host, port, path, query and hash as they light up, then add a second tag= parameter to show how duplicates stack. The shareable link reopens the exact example you walked through.

URL Parser: Protocol, Host, Path, Query and Hash

Break any URL into protocol, host, port, path, query and hash, with a decoded parameter table, all in your browser

Runs locally
Category Developer & DevOps
Best for Formatting, validating, shrinking, or inspecting code-adjacent text.

URL

Type or paste a URL above to see its parts.

What this tool does

A fast online URL parser that splits any link into its structural parts: protocol, basic-auth username and password, hostname, port, path, query string and hash fragment. It reads the URL with the browser's native URL engine, so the breakdown matches exactly what a browser, a fetch call or a server router would see. The query string is parsed into a clean key/value table where every parameter is percent-decoded for you, "+" is turned back into a space, and repeated keys such as tag=a&tag=b are each listed on their own row instead of being collapsed. Copy any single part with one click, or grab the whole result as formatted JSON. You also get the hostname split into labels, the path split into segments and a live parameter count. Malformed input gets a friendly note rather than a crash, and everything runs client-side, so no URL ever leaves your tab.

Tool details

Input: Text + Structured content; The page exposes text boxes, numeric controls, file pickers, or structured inputs depending on the tool.
Output: Live result + Copy; The result area focuses on usable output, with copy, download, or preview actions when supported.
Privacy: Browser-side processing; The main tool logic does not call an external API, so inputs normally stay in the current tab.
Save / share: Shareable URL state; Key settings are encoded in the URL so another person can reopen the same setup.
Performance budget: Initial JS <= 9 KB; No WASM budget is declared, keeping the tool quick to open on mobile.
Best fit: Developer & DevOps · Developer; Category and role tags drive related tools, internal links, and quick fit checks.

How to use

1. Input

Paste or drop your content into the tool panel.
2. Process

Click the button. All processing is local in your browser.
3. Copy / Download

Copy the result or download to disk in one click.

How URL Parser fits into your work

Use it in the small gaps between coding, reviewing, debugging, and shipping.

Developer jobs

Formatting, validating, shrinking, or inspecting code-adjacent text.
Preparing snippets for documentation, tickets, commits, or handoff.
Checking a small payload quickly without switching tools.

Developer checks

Run irreversible transforms like minify or obfuscate on a copy.
Keep secrets out of pasted snippets unless the tool explicitly stays local.
Use your normal tests or linter before shipping transformed code.

Good next steps

These links move the current task into a more complete workflow.

Real-world use cases

Debug a tracking link that is not firing right
A marketing URL comes back with the wrong campaign, and you cannot tell why from the long string. Paste it in and the query table lays out utm_source, utm_medium and utm_campaign each on its own line, decoded. You spot that utm_campaign reads "spring sale" with a raw space instead of an encoded one, or that a stray second utm_source is overriding the first. Two seconds of reading beats squinting at a 200-character link.
Read an OAuth or redirect callback URL
OAuth and SSO flows bounce the user through callback URLs packed with code, state, scope and redirect_uri values, often double-encoded. Drop the callback in to see each parameter decoded and separated, confirm the state matches what you sent, and check that redirect_uri points where you expect. Catching a mismatched redirect_uri here saves a long round of "why is the login loop broken".
Verify an API request URL before you ship it
Before hardcoding an endpoint, paste the full request URL to confirm the host, port, path and every query parameter are exactly right. The path-segment and host-label breakdown make it obvious if you typed /v2//search with a double slash or pointed at staging instead of the production host. Copy the cleaned JSON straight into a test fixture.
Teach how a URL is structured
When explaining the anatomy of a URL to a student or a junior teammate, a labeled live breakdown beats a diagram. Type a real URL, point at the protocol, host, port, path, query and hash as they light up, then add a second tag= parameter to show how duplicates stack. The shareable link reopens the exact example you walked through.

Common pitfalls

Assuming a query parameter appears only once. URLs can repeat a key, like tag=a&tag=b, and code that calls .get('tag') silently sees only the first value. This tool lists every occurrence on its own row so you never miss a duplicate that changes behavior.
Forgetting the value is percent-encoded. A raw query holds q=url%20parser or lang=%E4%B8%AD%E6%96%87, not the readable text. Reading the encoded form leads to wrong comparisons. The table shows the decoded value, so q reads "url parser" and lang reads "中文".
Confusing the host with the hostname. The host field includes the port (example.com:8443) while the hostname is just the name (example.com). Comparing the wrong one when matching an origin or a CORS rule causes false mismatches. Both are shown separately here.

Privacy

Parsing happens entirely in your browser tab using the built-in URL engine and plain JavaScript. The URL you paste, the parts it splits into and the decoded parameters never touch a server and are not logged. One thing to know: the shareable link puts your input URL into this page's own query string so a recipient sees the same parse, which means a "share link" pasted into chat will record that URL in the recipient server's access log. If the URL carries a token or a secret, use the copy button and paste the result instead of sharing the link.

FAQ

Tool combos

Folks in your role tend to reach for these alongside this tool.

Developer

Browse all tools for this role

URL Parser: Protocol, Host, Path, Query and Hash

What this tool does

Tool details

How to use

1. Input

2. Process

3. Copy / Download

How URL Parser fits into your work

Developer jobs

Developer checks

Good next steps

Real-world use cases

Debug a tracking link that is not firing right

Read an OAuth or redirect callback URL

Verify an API request URL before you ship it

Teach how a URL is structured

Common pitfalls

Privacy

FAQ

URL Encoder / Decoder

Query String to JSON Converter

URL Query Params Extractor

JSON to Query String Converter

AI Eval Planner

Apache Cheatsheet

API Key Generator

API Rate Limit Cheatsheet

ASCII Table Generator

ASCII Table Reference

awk + sed Cheatsheet

AWS CLI Cheatsheet