Convert any image to a Base64 data URI right in your browser — no upload, no server, completely private.
🖼
Drag & drop an image here, or click to select a file
Supports PNG, JPG, GIF, SVG, WebP · Max recommended: 2 MBBase64 String (no prefix)
<div class="i2b-output-block">
<div class="i2b-output-header">
<span class="i2b-output-label">Data URI</span>
<button class="i2b-copy-btn" data-target="i2b-out-uri">Copy</button>
</div>
<textarea id="i2b-out-uri" class="i2b-output-textarea" readonly spellcheck="false"></textarea>
</div>
<div class="i2b-output-block">
<div class="i2b-output-header">
<span class="i2b-output-label">CSS background-image</span>
<button class="i2b-copy-btn" data-target="i2b-out-css">Copy</button>
</div>
<textarea id="i2b-out-css" class="i2b-output-textarea" readonly spellcheck="false"></textarea>
</div>
<div class="i2b-output-block">
<div class="i2b-output-header">
<span class="i2b-output-label">HTML <img> tag</span>
<button class="i2b-copy-btn" data-target="i2b-out-html">Copy</button>
</div>
<textarea id="i2b-out-html" class="i2b-output-textarea" readonly spellcheck="false"></textarea>
</div>
How to use
- Drag and drop an image onto the zone above, or click to open the file picker.
- The tool reads the file locally using the FileReader API — nothing is sent to any server.
- Copy the output you need with the corresponding Copy button.
Output formats explained
| Format | When to use |
|---|---|
| Base64 string | APIs, databases, JSON payloads |
| Data URI | Direct src attribute value |
| CSS background-image | Paste straight into a stylesheet |
HTML <img> tag | Paste straight into HTML |
Why Base64-encode an image?
Embedding an image as a Base64 data URI lets you ship a self-contained HTML file or email template with no external requests. It is also useful for small icons in CSS, API payloads, and offline-capable web apps. The trade-off is a roughly 33% size increase and slightly slower initial parse — so keep embedded images small (under ~50 KB is a good rule of thumb).
Privacy
All conversion happens entirely in your browser. The image file never leaves your device.
Related tools: Base64 Encoder / Decoder · Image Resizer · Placeholder Image Generator