URL Component Encoder/Decoder - Online encodeURIComponent
Encode or decode a string for use in a URL query parameter. See the raw and encoded versions. Dev tool.
UD5 Toolkit
| # | Parameter Name | Value | Action |
|---|---|---|---|
| No query parameters found | |||
Enter a URL above and click Parse URL to decompose it into components
https://, http://, ftp://www.example.com):8080)/blog/article)? (e.g., ?id=123&sort=asc)# (e.g., #section2)www.example.com or 192.168.1.1). Host includes the hostname plus the port number if one is explicitly specified (e.g., www.example.com:8080). If no port is specified in the URL, the host and hostname are identical. This distinction is important when working with non-standard ports in web development and API configurations.
? character in a URL. They are separated by & and follow the format key=value. Our tool uses the URLSearchParams API to parse them accurately, automatically handling URL encoding (e.g., %20 → space, %2F → /). Each parameter is displayed with both its raw encoded form and its decoded, human-readable value. This is particularly useful for debugging tracking parameters, API calls, and form submissions.
# symbol. It is never sent to the server — it is handled entirely by the browser (client-side). Common uses include: navigating to a specific section of a page via anchor links (e.g., #faq-section), tracking state in single-page applications (SPA routing with #/dashboard), and storing temporary client-side data. Understanding fragments is crucial for front-end developers working with SPAs and anchor navigation.
https://example.com:443/path will show an empty port since 443 is the default for HTTPS. Only non-standard ports (like 8080, 3000, 8443) will appear explicitly in the parsed output.
äľ‹.com will be parsed as its Punycode equivalent xn--fsq.com. Our tool displays the hostname exactly as the browser interprets it, which is the form actually used in DNS resolution and HTTP requests.
Encode or decode a string for use in a URL query parameter. See the raw and encoded versions. Dev tool.
Convert title to URL slug with options: ignore stop words, transliterate special characters, choose separator. SEO friendly.
Enter a URL and see a nested list of all h1‑h6 tags. Check document structure for SEO and accessibility.
Create a Svelte single‑file component with script, style, and markup. Choose TypeScript or JavaScript. Copy the .svelte file.
Create SEO‑friendly slugs that handle characters from any language. Removes accents, converts Cyrillic, Greek, etc. to Latin. Local.
Paste an SVG and get a ready‑to‑use data URI for CSS backgrounds or img tags. Optimized with URL encoding. All local.
Optimize an SVG and convert it into a URL‑encoded data URI ready for CSS backgrounds. Strip unnecessary attributes. All local.
Minify JavaScript and CSS code to reduce file size for production. Remove whitespace and comments instantly. Run locally, your code stays private.
Generate a standard otpauth:// URI and QR code for authenticator apps. Set issuer, account, and secret. All local.
Paste an SVG and get an optimized, URL‑encoded data URI for use in CSS backgrounds. Reduces file size and escapes characters.
Convert a JSON object into application/x‑www‑form‑urlencoded format. Essential for testing legacy APIs. Pure browser.
Shows the decimal and hex code point for every character in a string, including emojis. Copy as array. Dev reference.
Make your JavaScript code more readable with this online beautifier. Format and indent JS automatically. Works entirely in your browser, protecting your code privacy.
Write a standard README with pre‑filled sections like Installation, Usage, and License. Export as Markdown. Save time.
Generate a CSR and private key pair in the browser using the Web Crypto API. Download both as files. No data sent to server.
Paste an SVG path and convert all relative commands to absolute. Also smooth curves to lines. Local parser.
Paste Jira/Confluence wiki markup and get a rendered HTML preview. Supports headings, lists, links, and code blocks. All local.
Paste an SSL certificate and private key to verify they belong together. Check if a CSR matches a private key. All local crypto.
Paste INI content and convert it to a structured JSON object. Handles sections and comments. Client‑side only.
Enter a JSON pointer expression (/foo/bar) to extract a value from your pasted JSON. Debug nested objects quickly.
Paste code and get a beautifully highlighted preview with line numbers. Supports many languages. Copy as HTML. Pure frontend.
Create an import map JSON with CDN links. Use bare specifiers like `import React from 'react'` without bundlers.
Convert standard HTML into Pug (formerly Jade) syntax. Clean, indented output. For Node.js templating. Client‑side.
Type a common ingredient and get possible substitutes with ratios. Perfect for emergency cooking. Static reference.
Convert an SVG into a named React component with TypeScript. Clean attributes and add props. Dev tool.
Generate a SolidJS component with signals, props, and styles. Choose TypeScript. Copy the ready‑to‑use code.
Hash any text using simple, fast algorithms: DJB2, SDBM, or CRC32. Get integer or hex. For quick lookups. Local.
Paste JSON and generate typed model classes in TypeScript, Python dataclass, or Go struct. Speeds up API dev.
Write a JavaScript snippet and get a ready‑to‑drag bookmarklet link. With minification and encoding. Easy browser tools.
Write a module and import it. See how browser handles module scripts. Learn modern JS structure.