Base64 Encoder
Encode text or binary to Base64 for inline embedding, data URIs, or transport.
Tool hub8 tools
Encoder & Decoder Tools
Convert between text and every common encoding used in web development: Base64, URL percent-encoding, HTML entities, hex, binary, and image data URIs. Two-way encoding and decoding in your browser — no upload, no signup.
Base64 Decoder
Decode Base64 strings back to readable text or binary downloads.
URL Encoder / Decoder
Percent-encode and decode URL components, query strings, and path segments.
HTML Entities Encoder/Decoder
Convert special characters to &-encoded entities for safe HTML inclusion.
Hex Encoder/Decoder
Convert between text and hexadecimal representation for debugging and crypto workflows.
Binary Encoder/Decoder
Encode text to binary and decode binary back — useful for low-level debugging and CS exercises.
Image to Base64 Converter
Convert images to Base64 data URIs for inline embedding in HTML, CSS, or JSON.
Escape & Unescape
Escape special characters for JSON, JavaScript strings, regex, and shell contexts.
Pick the encoding that matches your transport
Every encoding has a specific job. Choosing the wrong one leads to subtle bugs that look fine in your editor but break in production. Quick reference:
- Base64 — for transporting binary through text-only channels (email bodies, JSON fields, data URIs in CSS/HTML). Adds ~33% size overhead.
- URL encoding (percent-encoding) — for embedding arbitrary text in URLs. Required for spaces (%20), special chars (?, &, #), and Unicode.
- HTML entities — for safely including characters that have meaning in HTML (<, >, &, ") inside HTML body or attribute values.
- Hex — for debugging binary data, color values, byte-level inspection, cryptographic hash representation.
- Binary — for low-level debugging, CS coursework, and bit-level explanations. Rarely needed in production code.
- Escape sequences (\n, \t, \") — for embedding characters in JSON strings, JavaScript literals, regex patterns, or shell commands.
The Base64 size trade-off
Base64 inflates payload size by ~33% (every 3 bytes of binary become 4 ASCII chars). For small images embedded directly in CSS or HTML, this is worth eliminating the extra HTTP request. For large images, real-world numbers favor keeping them as separate files: the extra bytes are not cached separately from the parent document, so every page reload pays the full cost.
Practical rule of thumb: Base64 anything under ~5KB; keep larger assets as separate files referenced by URL.
URL encoding gotchas
The trickiest URL encoding case is when you have already-encoded text that gets encoded again (double-encoding). A space becomes %20 the first pass and %2520 the second pass. This usually shows up when you concatenate strings instead of using a proper URL builder like URL in modern JavaScript or your framework's URL helpers.
Use the URL Encoder / Decoder to inspect suspicious URLs — if you see %25 followed by another encoded sequence, it has been double-encoded somewhere.
HTML entity defense against XSS
HTML entity encoding is also the primary defense against cross-site scripting (XSS) when you render user input. A <script> tag in user input becomes<script> after encoding — the browser displays it as text rather than executing it. Modern frameworks (React, Vue, Svelte) do this automatically when you render strings — but raw dangerouslySetInnerHTML orv-html bypasses the protection and requires manual encoding.
Privacy
Every encoder on this hub runs in your browser. Input never leaves your device. This makes the tools safe for secrets, API keys, tokens, or anything else you do not want echoed to a third-party server.
Related hubs
- Security & Hash Tools — when you need cryptographic guarantees on top of encoding.
- JSON Tools Hub — JSON-specific validation, formatting, and conversion utilities.
- Developer Tools Hub — HTML, CSS, JS, regex, and Markdown utilities.