OmniTools
imageDifficulty: 2/5

Image to Base64 Converter

Convert an image to Base64 and a data URL, with ready-made CSS and HTML snippets and the size overhead reported honestly.

Base64 makes files bigger: Base64 rewrites every three bytes as four printable characters, so the text is about a third larger than the file — typically 33% to 37%. That trade is worth it for a small icon, where inlining removes an HTTP request entirely. It is a poor trade for a photograph: the bytes cannot be cached separately, they bloat every copy of the stylesheet or HTML that carries them, and they cannot be served in a more modern format later. As a rough rule, inline under a few kilobytes and link anything larger.
The format is read from the bytes: The image type is identified from its magic bytes — the signature at the start of the file — not from the extension or the type the browser reports. A .png that is really a JPEG is encoded with the correct MIME type regardless of what it is called, so the snippets you copy will actually work.

How it works

  1. Choose an image, or drop one onto the box.
  2. The file is read in your browser and encoded to Base64 — nothing is uploaded.
  3. Copy the raw Base64, a data URL, or a ready-made CSS or HTML snippet.
Privacy & Processing: Everything runs in your browser. Your image and its filename are never uploaded, stored, or sent to analytics.

Frequently Asked Questions

What do I get back?

The raw Base64, a complete data URL, a CSS background-image declaration and an HTML img tag — the three forms people actually paste. The alt text you supply is HTML-escaped, because that string ends up inside an attribute in your own page.

Why is the Base64 bigger than my file?

Base64 encodes three bytes as four characters, so the result is about 33% larger plus padding. The exact overhead is shown. That is the trade-off for inlining: one fewer request, more bytes. For anything above a few kilobytes a normal file reference is usually faster.

How is the format determined?

From the file’s magic bytes, never its extension or its reported MIME type — both are trivially wrong. PNG, JPEG, WebP, GIF, BMP, AVIF, ICO and SVG are all recognised.

Is my image uploaded?

No. Encoding happens in your browser and the file never leaves it. The filename is not sent to analytics either.

Related Tools