URL Encoder

URL Encoder / Decoder

Encode any text into a percent-encoded URL-safe string, or decode an encoded URL back to plain text. Live preview, UTF-8 safe, and runs entirely in your browser.

Plain text

0 chars

Encoded output

0 chars

Why iKit URL Encoder

Fast, accurate, browser-only — built for developers, copywriters, and anyone debugging a URL.

Three encoding modes

Pick Component, Full URI, or Form mode depending on what you're encoding — query-string values, a whole URL, or an HTML form payload.

Privacy by design

Every encode and decode happens in your browser using native JavaScript. Your text and URLs never leave your device.

Live preview

Output updates on every keystroke — no "Encode" button to click, no round-trip to a server.

UTF-8 safe

Emoji, CJK characters, accented Latin, and Cyrillic round-trip correctly through encodeURIComponent and back.

Form-style + handling

When decoding, optionally treat '+' as a space — the convention HTML forms use under application/x-www-form-urlencoded.

Bulk file processing

Drop a .txt, .csv, or .json file to encode or decode it in one step. Output downloads as a clean .txt.

How URL encoding actually works

Three native browser APIs, three modes, all running in the page you're reading.

  1. 1

    You type into the editor

    On every keystroke, the input string is passed to a small JavaScript function. There is no debounce, no API call, no fetch — the function runs synchronously in your browser tab.

  2. 2

    Pick the mode

    Component calls encodeURIComponent() — escapes everything that isn't A-Z a-z 0-9 - _ . ~. URI calls encodeURI() — preserves :/?#=& so a full URL stays valid. Form uses encodeURIComponent and replaces space with + per application/x-www-form-urlencoded.

  3. 3

    UTF-8 happens for free

    Both encodeURIComponent and encodeURI internally convert the string to UTF-8 bytes before percent-encoding each non-safe byte. That means %E4%B8%AD for the Chinese 中 — exactly what RFC 3986 requires.

  4. 4

    Output appears live

    The result is set as the read-only output's value. Click Copy to put it on your clipboard via navigator.clipboard.writeText(), or Download to save it as a .txt via a Blob URL — both stay in your browser.

Common use cases

Real situations where the right encoding mode prevents bugs.

Building query-string values

Any user input you put into <code>?q=...</code> must be encoded with Component mode. URI mode would leave <code>=</code> and <code>&amp;</code> raw, breaking your URL when the value contains them.

Sharing a long URL on chat

Some chat apps and PDFs corrupt links when they contain raw spaces or non-ASCII characters. Run the URL through URI mode to make it copy-paste-safe everywhere.

Debugging a backend that returns 400

When your API rejects a request, paste the URL into Decode mode to see what the server actually saw. Double-encoded values (where <code>%</code> itself was encoded as <code>%25</code>) show up immediately.

Form data round-trip

When debugging POST bodies in <code>application/x-www-form-urlencoded</code>, decode with the "+ as space" toggle on. That's the convention browsers use, and forgetting it is the #1 cause of "why is my username showing up with plus signs" bugs.

Why local encoding matters

URLs you encode often contain real customer emails, IDs, or session tokens — exactly the kind of data you don't want to paste into a stranger's server tool. iKit URL Encoder runs as JavaScript already loaded in your browser, so the input never leaves your tab.

  • No <code>fetch()</code>, <code>XHR</code>, or beacon during encode or decode.
  • Works offline once the page has loaded.
  • No log, no rate limit, no signup, no daily quota.

Frequently Asked Questions

What's the difference between Component, URI, and Form modes?

Component (encodeURIComponent) escapes everything that isn't an unreserved character — safest for query-string values, path segments, or any single field. URI (encodeURI) preserves the URL structure characters (:/?#=&) — use it on a whole URL. Form (application/x-www-form-urlencoded) is Component + spaces become '+' — what HTML forms use.

Why are some characters not encoded?

RFC 3986 defines a set of "unreserved" characters that don't need encoding: A-Z a-z 0-9 - _ . ~. Anything else is percent-encoded. encodeURIComponent additionally encodes :/?#&= which encodeURI leaves alone. The difference matters when you're encoding a query value vs. a whole URL.

Why does my decoded text look wrong?

Three common causes: (1) the original was Form-encoded so '+' should be treated as space — toggle that option. (2) Double-encoded — the input was encoded twice; decode again. (3) Invalid percent sequence — a stray % not followed by two hex digits. Check the error message for the exact byte position.

Is the encoded URL exactly the same as JavaScript's encodeURIComponent?

Yes for Component mode — we call encodeURIComponent directly. Form mode adds the standard form-encoding tweaks (! ' ( ) * become %21 %27 %28 %29 %2A) per RFC 3986 + WHATWG. URI mode calls encodeURI, which is what most languages mean by 'percent-encode a URL'.

Are my URLs uploaded anywhere?

No. The whole tool is JavaScript inside this page — encoding and decoding happen in your browser. You can verify by opening DevTools → Network and watching: no requests are sent during encode or decode operations.