Image to Base64 — Free Data URI

Convert an image to a Base64 data URI for HTML/CSS. 100% in your browser — free, no sign-up.

How to

  1. 1Choose an image — it is encoded in your browser and never uploaded.
  2. 2Copy the Base64 data URI, or the ready-made CSS snippet.
  3. 3Paste it into your HTML or CSS.

What is a Base64 data URI?

A data URI encodes an image as a long Base64 text string that can be placed directly inside HTML or CSS instead of linking to a separate file. The browser decodes it back into the image — so the picture travels inside your code with no extra request.

How it works here

Your image is read and Base64-encoded entirely in your browser, then given to you as a ready-to-paste data URI or a CSS background snippet. Nothing is uploaded, so even private images stay on your device.

When to use a data URI

Inline a small icon or logo to save an HTTP request, embed an image in a single self-contained HTML email or file, or include a graphic where you cannot host a separate image. It is most useful for small images.

When not to use it

Base64 makes data about 33% larger and cannot be cached separately by the browser, so it is a poor fit for large images or pictures reused across many pages. For those, a normal image file is faster.

FAQ

Is my image uploaded?+

No. The image is read and encoded in your browser, so it never leaves your device.

What do I get back?+

A ready-to-paste Base64 data URI, plus a CSS background snippet, that you can drop straight into HTML or CSS.

Should I inline large images?+

Usually no. Base64 makes data about 33% larger and cannot be cached separately, so it is best for small icons and logos, not big photos.

Why use a data URI at all?+

It embeds an image directly in your code, saving an HTTP request and keeping everything in one self-contained file or email.

Is it free?+

Yes, completely free — no sign-up and no watermark.

Is my data private?+

Yes — this tool runs entirely in your browser. Your files and text are never uploaded.

Related tools

Also available for AI agents:Markdown ·JSON