Image to Base64
Drop an image, get Base64 and Data URI
How to Use
Embedding images as Base64 in HTML/CSS/Markdown cuts HTTP requests and avoids broken external links — handy for small icons, placeholders and email graphics. The output works directly in an img src or CSS url().
How to use: pick or drop an image file; the tool shows a preview with dimensions and file size, and generates both a full Data URI and raw Base64 for you to copy. Conversion runs locally via FileReader — the image is never uploaded. Note that Base64 inflates size by about 33%, so avoid embedding large images.
FAQ
Is my image uploaded to a server?
No. Conversion happens locally through the browser's FileReader API — image data never leaves your device, so private images are safe.
How much bigger is a Base64 image?
Base64 encodes binary into 64 characters, inflating size by about 33%. Embed only small images (a few KB to tens of KB) — inlining large ones slows page loads and isn't worth it.
What's the difference between Data URI and raw Base64?
A Data URI is the complete form with a protocol header (data:image/png;base64,...) — paste it straight into a browser address bar or your code. Raw Base64 is just the encoded body, suited for API transfer.