Image to Base64

Get a data URI you can paste straight into CSS or HTML — encoded locally, so unreleased assets stay unreleased.

Drop an image here or tap to choose — any image format

No file selected yet

Nothing leaves your deviceNo server sees your files. Turn off your wi-fi and it still works.

No queue, no daily capConvert as many files as you want, as often as you want.

No watermark, no accountYou get a clean file, with the original filename.

What a data URI buys you

Encoding an image as Base64 lets you embed it directly in a stylesheet or an HTML document, so the browser never makes a separate request for it. For small assets — icons, a logo in an email template, a texture used once — that removes a round trip and eliminates the possibility of a broken link.

The 33% tax

Base64 represents three bytes of binary as four characters of text, so the encoded version is always about a third larger than the file. The readout above shows the exact overhead for your image. That cost is worth paying for a 2 KB icon and is a bad trade for a 500 KB photograph, which should stay a normal image request that the browser can cache separately.

Where it works and where it does not

Data URIs work in CSS background-image, in HTML <img src>, and in most email clients — though Outlook on Windows is a notable exception and will simply not render them. They also cannot be cached independently: change one byte of the stylesheet and the whole thing is re-downloaded, image included.

A practical rule: embed anything under about 4 KB, link anything larger, and never embed something that appears on many pages.

Common questions

Why is the text longer than my file?

Base64 encodes three bytes as four characters, so the output is roughly 33% larger than the original. The exact overhead is shown with the result.

Is my image uploaded to encode it?

No. The encoding happens in your browser with the FileReader API. Nothing is transmitted, which matters if the asset is not public yet.

Where can I paste this?

Anywhere a URL is accepted: CSS background-image, an img tag's src, or an SVG. The Copy as CSS button gives you the property already written out.

Should I embed large images this way?

No. Above roughly 4 KB the size penalty and the loss of separate caching outweigh the saved request. Link to those normally.

Do data URIs work in email?

In most clients, yes. Outlook on Windows is the significant exception — it will not display them at all.