Image to Base64 Converter

Convert any image (JPG, PNG, GIF, WebP, SVG) to Base64 string or Data URI instantly. Preview image, copy base64 or data URI. Free, browser-based, no upload.

100% Client-Side Your data never leaves your browser Free · No Sign-Up

Drop an image here, or click to select

Supports JPG, PNG, GIF, WebP, SVG, BMP

How to Use

  1. Drag and drop an image onto the drop zone, or click the area to open the file picker.
  2. The image preview, file info, and encoded outputs appear instantly.
  3. Click Copy next to Base64 String to copy the raw base64 data.
  4. Click Copy next to Data URI to copy the complete data URI for use in HTML/CSS.
  5. Click Clear to reset and encode another image.

Common Use Cases

Embed in HTML

Use the Data URI directly in an <img> tag to inline the image without an HTTP request.

Embed in CSS

Use the Data URI as a CSS background-image value for icons and logos.

JSON payloads

Use the Base64 string to include image data in JSON API requests where binary data is not supported.

Base64 Encoding Overhead

Base64 encoding increases the data size by approximately 33% compared to the original binary file. For example, a 100 KB PNG becomes ~133 KB when base64-encoded. This is acceptable for small images (icons, logos) but is inefficient for large photos.

FAQ

What image formats are supported?

All image formats your browser supports: JPG/JPEG, PNG, GIF, WebP, SVG, BMP, ICO, TIFF, and AVIF. The tool uses the browser's native FileReader API.

What is the difference between Base64 and Data URI?

A Base64 string is the raw encoded image data. A Data URI is the complete inline resource: it prepends the MIME type prefix (e.g. data:image/png;base64,) so you can embed it directly in HTML img src attributes or CSS background-image.

Is there a file size limit?

There is no hard limit, but very large images (>5 MB) may slow down your browser since encoding happens in-memory. For large files, consider compressing the image first.

Is my image uploaded anywhere?

No. The conversion runs entirely in your browser using the FileReader API. Your image file never leaves your device.

Related Tools

Base64 Encode / Decode Encode text to Base64 or decode Base64 back to plain text. URL Encode / Decode Encode or decode URL components and query strings. HTML Entity Encoder / Decoder Encode and decode HTML entities. Supports named, decimal, and hex entities. ASCII Converter Convert between text and ASCII codes. Supports decimal, hex, and binary representations.