ToolGenie

Image to Base64

Turn an image into a data URI.

Drop an image here

or

How to use Image to Base64

  1. Drop an image file onto the uploader, or click to select one.

  2. Pick the output you need: raw Base64, a data URI, a CSS rule or an img tag.

  3. Copy the snippet straight into your stylesheet or markup.

Frequently Asked Questions

When should I inline an image as Base64?

For small assets — icons, logos, a 1-pixel gradient — inlining saves a network request. Base64 adds about 33% to the size, so keep large photos as separate files.

Which formats are supported?

PNG, JPG, WEBP, GIF and SVG. The correct MIME type is written into the data URI automatically so browsers render it right away.

Is my image uploaded anywhere?

No. The file is read by your browser with the FileReader API and encoded locally, so unpublished artwork stays on your device.

Related tools

Base64 Encode / DecodeEncode and decode Base64 text.Favicon GeneratorTurn a logo into a complete favicon pack.Compress ImageShrink JPG, PNG and WEBP file size.Convert ImageConvert between JPG, PNG and WEBP.URL Encode / DecodePercent-encode and decode URLs.

Looking for something else? Browse all developer tools.