Encoding

Image ⇄ Base64 Converter

Image ⇄ Base64 Converter encodes image files into Base64 strings (data URLs) and decodes Base64 strings back into images that you can preview and download. It is useful for inlining icons in HTML or CSS and for inspecting data URLs embedded in API responses.

Conversion mode

Drop image files here

PNG / JPG / WebP / GIF / SVG / AVIF / ICO supported. Up to 10 files per session, up to 10 MB per file.

Add an image to see the conversion results here.

All images and text are processed entirely in your browser and never sent to a server.

Base64 Encode / Decode

Convert text to Base64 or decode Base64 back to text. Supports URL-safe Base64 and 76-char MIME line wrapping, and updates in real time. Runs entirely in your browser.

URL Encode / Decode

URL Encode / Decode converts text to percent-encoded URL format and back. Supports query-parameter and full-URL scopes, with optional form-encoding for spaces. Results update in real time. Runs entirely in your browser.

JWT Decoder

Paste a JWT (JSON Web Token) to split it into header, payload, and signature and view each as formatted JSON. Standard claims (iat / exp / nbf) are converted to human-readable times, with expiry warnings. Optional HS256 / HS384 / HS512 signature verification included. Runs entirely in your browser.

Hash Generator

Generate MD5, SHA-1, SHA-256, and SHA-512 hashes from text or files all at once. Includes HMAC (keyed hash) and one-click comparison against an expected digest. Runs entirely in your browser.

About Image ⇄ Base64 Converter

In the Image → Base64 mode, you can drag-and-drop multiple PNG, JPG, WebP, GIF, SVG, AVIF, or ICO files at once. Each image is shown with a thumbnail, the original byte count, and the byte count after Base64 encoding. The result includes the raw data URL as well as ready-to-paste snippets for CSS background-image, HTML <img> tag, and Markdown image syntax, switchable through tabs. You can also export every data URL in the session into a single text file.

In the Base64 → Image mode, paste either a data:image/...;base64,xxx data URL or a bare Base64 string. The format is inferred from the leading magic bytes (PNG / JPG / WebP / GIF / AVIF / ICO, plus the text header for SVG); pick a format manually from the dropdown when detection fails. Whitespace, line breaks, and URL-safe characters (-, _) in the input are normalised automatically.

Images and text are processed entirely inside your browser and are never sent to any external server, so it is safe to inspect screenshots that contain confidential or personal information. Runs entirely in your browser.

How to use

Choose either **Image → Base64** or **Base64 → Image** from the **Conversion mode** selector at the top.
Image → Base64: drag-and-drop image files into the drop zone, or pick them through **Select files**.
Use **Copy** on each card to copy the data URL, or switch the CSS / HTML / Markdown tab and copy the snippet you need.
Use **Download all as .txt** to export every data URL in the session as one text file.
Base64 → Image: paste either a data URL or a bare Base64 string into the input area.
If detection misses, override the format from the **Format** dropdown and use **Download image** to save the file.

Use cases

Inline small icons or SVGs into HTML / CSS to reduce the number of HTTP requests.
Generate data URLs on the fly to experiment with CSS `background-image` inlining.
Inspect and extract `data:image/...;base64,...` payloads embedded in API responses or HTML.
Create sample images embedded inline for HTML emails.
Encode fixture images as Base64 strings to commit them alongside source code for tests or E2E snapshots.

Notes

Up to 10 files per session and up to 10 MB per file. Files above the limits are rejected on intake.
Encoding an image into Base64 increases its byte size by roughly 33% (factor 4 / 3). Data URLs are an encoding for embedding bytes as text, not a compression format.
Inlining data URLs larger than 100 KB into CSS `background-image` is not recommended because the browser cannot cache them; oversized cards show a warning.
In **Base64 → Image**, the image format is inferred from the leading bytes after decoding (PNG / JPG / WebP / GIF / AVIF / ICO). SVG is detected from the leading text header.
Whitespace and line breaks are stripped automatically, and URL-safe characters (`-`, `_`) are converted into the standard alphabet. Missing trailing `=` padding is also handled.
When the input cannot be parsed, is not valid Base64, or decodes to more than 50 MB, a clear error message is shown.

FAQ

Are my images sent to a server?

No. All conversion happens inside your browser, so it is safe to inspect screenshots that contain confidential or personal information.

How much larger does Base64 encoding make an image?

About 33% larger (a factor of 4 / 3). You may trade fewer HTTP requests for that overhead, but keep in mind that inlined data URLs cannot be cached separately by the browser. For large images, prefer linking to the original URL.

How large an image can I convert?

Up to 10 MB per file. Anything larger is rejected because the resulting text would be heavy enough to slow the browser down.

Can I decode a Base64 string without the `data:image/...` prefix?

Yes. The image format is inferred from the leading magic bytes after decoding, so a bare Base64 string works out of the box. Use the **Format** dropdown when detection fails.

Does it support SVG?

Yes. **Image → Base64** accepts SVG files directly, and **Base64 → Image** can recover SVGs from either a data URL or a bare Base64 string (SVG is detected when the decoded text starts with `<?xml` or `<svg`).

Are transparent PNGs preserved?

Yes. Base64 is a byte-exact encoding, so alpha channels and colour information are not altered. The restored PNG is bit-for-bit identical to the original file.