Is the image uploaded anywhere?

No. The conversion happens in your browser via the FileReader API — bytes never leave the page. There's also no analytics event that includes the file contents.

Why is the data URI bigger than the file?

Base64 encoding inflates binary data by about 33% (every 3 bytes become 4 characters). For a 100 KB image, expect ~133 KB of text. That's the cost of embedding binary data in a text container.

When should I inline an image instead of linking it?

Inlining can be reasonable for a small image used once, such as a compact icon or a self-contained HTML example. For larger or reused assets, a separate file is often easier to cache, update, and inspect. The right threshold depends on the page, cache policy, and audience rather than one universal byte limit.

What's the MIME type for SVG?

`image/svg+xml`. The encoder reads it from the file's `type` attribute, which the browser sets correctly for standard image formats.

Can I encode non-image files?

This widget is image-only by design (and validates the data URI prefix on decode). For arbitrary binary → Base64 see /code/base64/, which handles UTF-8 text directly.

Image to Base64 Converter — Encode or Decode

Encode any image to a data URI, or paste a URI and see the image.

A Base64 data URI lets you embed an image inline in HTML, CSS, or JSON instead of referencing a separate file. That can be convenient for a small icon, a self-contained example, or a payload that must carry the image bytes with it. The tool accepts one image up to 8 MB for encoding, or a full data:image/… URI for preview; the conversion runs in your browser using FileReader and browser Base64 APIs.

Drop or pick an image

Everything happens locally — the FileReader API runs entirely in your browser. No upload, no analytics on the file contents.

How to use

Pick a direction
"Image → Base64" encodes a file you drop. "Base64 → Image" decodes a data URI you paste in.
Drop or paste
Drag a file onto the dropzone (encode), or paste the data URI into the textarea (decode). Files up to 8 MB are accepted.
Copy or save the result
Encoded output is a full data URI ready to place in an image source, CSS background-image, or JSON value. The decoded preview renders below the paste field; this widget previews the URI rather than writing a new image file.

Related image and developer tools

Use Base64 for a self-contained image value; choose a file converter when you need a different format or a downloadable asset.

Frequently asked questions

Is the image uploaded anywhere?: No. The conversion happens in your browser via the FileReader API — bytes never leave the page. There's also no analytics event that includes the file contents.
Why is the data URI bigger than the file?: Base64 encoding inflates binary data by about 33% (every 3 bytes become 4 characters). For a 100 KB image, expect ~133 KB of text. That's the cost of embedding binary data in a text container.
When should I inline an image instead of linking it?: Inlining can be reasonable for a small image used once, such as a compact icon or a self-contained HTML example. For larger or reused assets, a separate file is often easier to cache, update, and inspect. The right threshold depends on the page, cache policy, and audience rather than one universal byte limit.
What's the MIME type for SVG?: `image/svg+xml`. The encoder reads it from the file's `type` attribute, which the browser sets correctly for standard image formats.
Can I encode non-image files?: This widget is image-only by design (and validates the data URI prefix on decode). For arbitrary binary → Base64 see /code/base64/, which handles UTF-8 text directly.

About

What's a data URI?

A URI scheme defined in RFC 2397 that embeds the resource inline. `data:image/png;base64,iVBORw0KGgo...` declares the MIME type, says the payload is Base64-encoded, and includes the bytes after the comma. Browsers and most parsers accept it anywhere an http(s) URL would be expected in image contexts.

What the widget does not change

Encoding produces a text representation of the original image bytes and keeps the source format in the data URI's MIME type. Decoding mode validates the `data:image/` prefix and previews the URI; it does not reconstruct a separate downloadable image file.

Sources & references

Authoritative references verified by Buğra Sözeri.

RFC 2397 — The "data" URL scheme — IETF specification for the data: URI format the widget emits(as of 2026-05-21)
RFC 4648 — Base16, Base32, and Base64 Data Encodings — Authoritative spec for the Base64 alphabet used in the encoded payload(as of 2026-05-21)
WHATWG HTML Standard — FileReader.readAsDataURL — Browser-native API used by the widget to read image files and produce a data URI(as of 2026-05-21)

Image to Base64 Converter — Encode or Decode

How to use

Pick a direction

Drop or paste

Copy or save the result