Image ↔ Base64 Converter
Convert images to Base64 data URIs for inline embedding, or decode Base64 back to a downloadable image.
About This Tool & Technical Logic
A data URI embeds a file's bytes directly in text, letting images live inside HTML, CSS, or JSON with no separate request. The converter reads your image locally, encodes it as a Base64 data URI, and reports the size overhead of embedding.
Decoding goes the other way: paste a Base64 string or data URI, see the image instantly, and download the recovered file. Everything happens in your browser — images are never uploaded.
FileReader.readAsDataURL(file) to encode; data URI → Blob → object URL to decode and preview.
How to Use — Step by Step
- 1
Drop an image (to encode)
PNG, JPG, WebP, GIF, and SVG all work. A 100 KB image becomes ~133 KB of text — check the overhead figure before embedding.
- 2
Copy as CSS or HTML
The output box offers the raw data URI plus ready-made <img> and background-image snippets.
- 3
Decode pasted Base64
Switch to decode mode, paste, verify the preview, and download the original image file.
Frequently Asked Questions
Only for small images (icons, logos under ~10 KB). Larger embeds bloat HTML, block caching, and delay first render — a CDN URL is better.