Skip to content

Image to Base64 Converter

Turns an image into a Base64 data URL, ready to paste into HTML, CSS, Markdown or JSON.

Your image stays on this device

This tool runs entirely inside your web browser. Your image is processed on your own device and is never sent to our servers. How this works

Drag and drop an image here

or

Image to Base64 Converter is a free tool that turns a PNG, JPG, SVG, GIF, WebP, AVIF or ICO image into a Base64 data URL. It gives you ready-to-paste code for an HTML <img> tag, a CSS background and Markdown, and shows how much bigger the image becomes. The conversion happens in your browser, so the image is never uploaded.

How to convert an image to Base64

  1. Drag an image onto the page or click Choose file.
  2. Pick the output you need: a data URL, Base64 only, an HTML tag, CSS or Markdown.
  3. Click Copy and paste it into your code.

Example output

A small PNG icon becomes a data URL like this:

data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9h…

Used in HTML:

<img src="data:image/png;base64,iVBORw0KGgo…" alt="Logo">

When embedding images makes sense

For larger photos, a regular image file is usually better: browsers cache files separately, and Base64 is a third larger. If you must embed a photo, shrink it first with the Image Compressoror Image Resizer.

SVG images

SVG files are encoded as Base64 like any other image. The result works in <img> tags and CSS. To turn an SVG into a regular picture instead, use SVG to PNG. For text or other kinds of files, use Base64 Encode.

Frequently asked questions

What is a data URL?

An image written out as text, starting with data:image/png;base64,. You can use it anywhere an image address goes, so the image is part of the page itself instead of a separate file.

When should I embed images as Base64?

For small images such as icons, logos and email signatures, where saving a separate download is worth it. For photos and anything over about 10–20 KB, a normal image file is usually faster, because it can be cached and is a third smaller.

Why is the Base64 bigger than my image?

Base64 uses 4 text characters for every 3 bytes, so it is about 33% larger than the original file.

Are my images uploaded?

No. The conversion happens in your browser, so the image never leaves your device.

Last updated

Missing a feature, or need a tool we don’t have? Suggest it.