Skip to content
Toolcroft

Developer Tools

URL Parser & Inspector - Decode Any URL Instantly

Parse any URL into its components: protocol, hostname, port, path, query parameters, and hash. Decode query strings, inspect domain parts, and build custom URLs.

URL anatomy

https://user:•••@www.example.com:8080/path/to/page?name=John Doe&tag=a&tag=b#section2
schemeuserinfohostportpathqueryfragment
Parsed URL
Full URLhttps://user:secret@www.example.com:8080/path/to/page?name=John%20Doe&tag=a&tag=b#section2
Protocolhttps:
Usernameuser
Password••••••
Hostnamewww.example.com
Port8080
Pathname/path/to/page
Hash#section2
Originhttps://www.example.com:8080

Domain breakdown

www (subdomain)example (domain).com (TLD)

Query parameters (3)

Key ▲▼Value ▲▼
nameJohn Doe
taga
tagb

URL anatomy

A URL (Uniform Resource Locator) is made up of several distinct parts:

  • Protocol: The scheme that tells the browser how to connect (https:, http:, ftp:)
  • Credentials: Optional username and password embedded in the URL
  • Hostname: The domain name or IP address of the server
  • Port: Optional port number (defaults to 443 for HTTPS, 80 for HTTP)
  • Pathname: The path to the resource on the server
  • Query string: Key-value pairs after the ?, used to pass parameters
  • Hash / fragment: The #section that tells the browser to scroll to a named anchor

About percent-encoding

URLs can only contain a limited set of ASCII characters. Special characters (spaces, accented letters, emoji, etc.) must be percent-encoded: replaced with a % followed by their two-digit hex value. For example, a space becomes %20. This tool decodes all percent-encoded values so you can read them as plain text.

Using the URL builder

The URL Builder tab lets you assemble a URL from its parts. Enter the hostname, path, and query parameters and the tool constructs a properly encoded URL. This is useful when you need to construct API endpoints or redirect URLs with special characters in the query string.

Browser URL API

Modern browsers provide the URL and URLSearchParams Web APIs for parsing URLs in JavaScript without manual string splitting:

const u = new URL('https://example.com/path?foo=bar&baz=1');
console.log(u.hostname);          // 'example.com'
console.log(u.searchParams.get('foo')); // 'bar'

URLSearchParams handles encoding and decoding automatically and is supported in all modern browsers and Node.js 10+.

URL security considerations

Open redirect vulnerabilities occur when an application accepts a URL parameter (e.g., ?next=https://evil.com) and redirects to it without validation. Always validate that a redirect target’s origin matches your own:

const target = new URL(redirectParam, window.location.origin);
if (target.origin !== window.location.origin) throw new Error('Invalid redirect');

Never blindly redirect users to a URL supplied in a query parameter.

Data URIs

A data: URI embeds resource content directly in the URL: data:text/html;base64,PHRpdGxlPkhpPC90aXRsZT4=. They are used in CSS background images to inline small assets and avoid HTTP requests. Limitations include: no browser caching (the data is re-parsed every use), significant size overhead for binary content, and blocking by strict Content Security Policies that disallow data: in img-src or script-src.