WebAssetKit

Image tools

Image to Base64 Converter

Encode an image as text you can paste into HTML, CSS, JSON or an email template. The file is read as it is, with no re-compression, and you get ready-made snippets for the most common uses. A second tab decodes Base64 text back into a downloadable image.

Loading tool…

Drop an image here or click to choose · JPG, PNG, WebP, GIF, BMP, SVG · up to 5 MB · you can also paste

How to use the Image to Base64

  1. Add an image (up to 5 MB). The Base64 text appears with a size comparison.
  2. Copy the output you need: full data URI, raw Base64, an HTML img tag, or a CSS background rule.
  3. To go the other way, open “Decode” and paste Base64 text or a data URI.

Tips for better results

  • Base64 makes data about 33% larger than the original file, and inline images cannot be cached separately. It suits tiny icons and email templates, not photos.
  • Keep inlined images under a few kilobytes. Anything bigger is almost always better as a normal file with caching.
  • Compress the image first with the Image Compressor; every byte saved is multiplied by the 33% overhead.

Limitations you should know about

  • Files larger than 5 MB are refused: the text would be enormous and may freeze the page or the editor you paste it into.
  • Decoding accepts PNG, JPG, WebP, GIF and SVG data. SVG output is shown as an image only; scripts inside it do not run.

Frequently asked questions

Is Base64 a form of compression or encryption?

Neither. It is a way to write binary data as plain text. It makes the data larger and anyone can decode it.

When should I inline an image as Base64?

For very small images (a few hundred bytes to a couple of kilobytes) that you want to avoid an extra request for, or where you can only supply text, such as some email templates and single-file HTML pages.

Is my image sent anywhere?

No. The file is read by your browser and the text is generated locally.

Guides that use this tool

Related tools