What is a Base64 data URI?

A data URI embeds a file directly in text as data:[type];base64,[data]. In HTML or CSS it lets a small image load without a separate network request.

When should I inline an image as Base64?

It works best for small, frequently used assets like icons and logos, where saving a request matters. Base64 adds about a third to the byte size, so large photos are better left as normal files.

Which image formats are supported?

PNG, JPEG, GIF, SVG, and WebP. The data URI keeps the original format; it does not re-encode the image.

Is my image uploaded?

No. The file is read and encoded locally with the browser FileReader, so it never leaves your device.

Image to Base64

Turn an image into a Base64 data URI, all in your browser.

How to use the Image to Base64

Drop in or pick an image (PNG, JPEG, GIF, SVG, or WebP).
The Base64 data URI is generated instantly, with the size shown.
Copy the raw data URI, a ready-made img tag, or a CSS background rule.

Frequently asked questions

What is a Base64 data URI?: A data URI embeds a file directly in text as data:[type];base64,[data]. In HTML or CSS it lets a small image load without a separate network request.
When should I inline an image as Base64?: It works best for small, frequently used assets like icons and logos, where saving a request matters. Base64 adds about a third to the byte size, so large photos are better left as normal files.
Which image formats are supported?: PNG, JPEG, GIF, SVG, and WebP. The data URI keeps the original format; it does not re-encode the image.
Is my image uploaded?: No. The file is read and encoded locally with the browser FileReader, so it never leaves your device.