Image to Base64 Converter — Free & Instant
Convert images to Base64 data URIs for embedding in HTML/CSS. Also decode Base64 back to images. 100% in your browser.
Drop an image to encode
Supports JPG, PNG, WebP, GIF, BMP
How It Works
In encode mode, drop an image file and the tool instantly converts it to a Base64 data URI using the browser's FileReader API. Copy the full data URI (with MIME type prefix) or the raw Base64 string — ready for embedding in HTML, CSS, or JSON.
In decode mode, paste a Base64 string or full data URI and the tool renders the decoded image for preview and download. No server required — everything runs in your browser.
Features
- ✓Two modes: Image → Base64 (encode) and Base64 → Image (decode)
- ✓Copy as full data URI (data:image/png;base64,...) or raw Base64 string
- ✓Supports all common image formats (PNG, JPG, WebP, GIF, BMP, SVG)
- ✓Instant encoding with no processing delay
- ✓Download decoded images as PNG
- ✓Output size indicator shows the Base64 string length
How to Use This Tool
- Choose mode: Encode (Image → Base64) or Decode (Base64 → Image).
- Encode: drop an image file to get the Base64 string instantly. Decode: paste a Base64 string or data URI.
- Copy the output (full data URI or raw Base64) or download the decoded image as PNG.
Perfect For
- →Frontend developers embedding small icons and logos directly in HTML/CSS to reduce HTTP requests
- →Email template designers embedding images inline to ensure display in email clients that block external images
- →API developers encoding image data for JSON payloads in REST APIs
- →DevOps engineers embedding small images in configuration files and markdown documentation
Under the Hood
Encoding uses the FileReader.readAsDataURL() method, which reads the file as a Base64-encoded data URI with the correct MIME type prefix. Decoding creates an Image element from the Base64 string, renders it to a canvas, and exports as a downloadable PNG via canvas.toBlob().