Image to Base64
Convert images to Base64 data URIs or decode Base64 to images.
Drop an image or click to upload
Image to Base64 — What It Does
Drop or select an image file to get its full Base64-encoded data URI — ready to paste into HTML, CSS, JSON, or JavaScript. The tool also works in reverse: paste a Base64 string to preview and download the decoded image. Everything runs in your browser with no server uploads, making it safe for confidential assets.
How to Use Base64 Images in Code
Data URI Format Reference
Performance Considerations
Frequently Asked Questions
- What is a Base64 data URI and how is it used in web development?
- A Base64 data URI embeds binary file data directly into a text string using the format data:[mediatype];base64,[encoded-data]. In HTML you can use it as an image src (e.g., <img src="data:image/png;base64,...">), in CSS as a background-image, or in JSON payloads to transfer image data without a separate HTTP request.
- Why does a Base64 string look much longer than the original file?
- Base64 encoding converts every 3 bytes of binary data into 4 ASCII characters, resulting in approximately a 33% size increase. A 100KB image becomes roughly 133KB as a Base64 string. This overhead makes Base64 suitable for small images but inefficient for large ones.
- When should I embed images as Base64 vs using a file URL?
- Use Base64 for small, frequently used images like icons and logos (under 5–10KB) where saving an HTTP round-trip is worth the size overhead. Use file URLs for larger images — the browser can cache them, and the 33% Base64 size penalty adds up quickly at scale.
- Can I use this tool to embed fonts or other binary files as Base64?
- This tool is optimised for images (PNG, JPEG, GIF, WebP, SVG) and produces the correct data URI prefix for each image MIME type. For other binary files like fonts (data:font/woff2;base64,...) or PDFs, the Base64 output is still valid but you will need to construct the correct data URI prefix manually.
- Is it safe to encode private images in this tool?
- Yes. All encoding and decoding happens entirely in your browser — no image data is sent to any server. Your files stay on your device throughout the process.