Convert an image to Base64
Drop an image into the box and get its Base64 code straight away, as a data URI, an HTML <img> tag, CSS or plain Base64. Copy what you need with one click.
Drag your image here
PNG, JPG, WebP, GIF, SVG or ICO · or paste with Ctrl+V
For src="…" or in JavaScript.
Paste this straight into your HTML.
As a background image.
Without a prefix, for example for an API.
How it works
-
Choose your image
Drop a file into the box or choose one on your device.
-
Adjust the settings
The preview changes as you drag. Hold the compare button to see your original.
-
Download the result
As PNG, JPG or WebP, at the same resolution as your original.
Four outputs
- Data URI:
data:image/png;base64,…, for asrc="…"attribute or in JavaScript. - HTML: a ready-made
<img>tag with the image embedded. - CSS: a
background-image: url(…)declaration. - Base64 only: the code without a prefix, for example for an API that expects a Base64 string.
The image is converted exactly as it is: nothing is re-encoded, so there is no loss of quality. PNG, JPG, WebP, GIF, SVG, ICO, AVIF and BMP are supported.
When is it a good idea?
Embedding an image saves a request, which suits small images such as icons, logos and placeholders in HTML, CSS or e-mail. For anything bigger, a separate file is usually faster: Base64 is about a third larger than the file itself and can't be cached separately. The tool warns you when an image is over 100 KB. A tiny icon as a data URI can even serve as a favicon; see how to make a favicon.
Frequently asked questions
Is converting an image to Base64 free?
Yes. You can convert as many images as you like, with no account.
When should I use an image as Base64?
For small images such as icons and logos in HTML, CSS or e-mail. For large images a separate file is usually faster, because Base64 is about a third larger and isn't cached on its own.
Which formats can I convert?
PNG, JPG, WebP, GIF, SVG, ICO, AVIF and BMP. The file is converted as it is, without quality loss.
Is my image uploaded?
No. The conversion happens in your browser; your image never leaves your device.