Convert an image to Base64 text.
Drop an image and get a Base64 data URL you can copy into HTML, CSS, JSON, or small test fixtures. Everything stays in your browser.
Local processing. Conversion and export happen in this tab; selected files are not sent to imgrove. Privacy details
Result will appear here
How to use Image to Base64
- Drop a JPG, PNG, or WebP image and let the browser turn it into a Base64 data URL.
- Copy the output as a Data URI, HTML image tag, CSS background, JSON string, or raw Base64.
- Download the .txt output when you want to save the full Data URI.
How it works
- The FileReader API reads the image as a Data URI, then the page derives HTML, CSS, JSON, and raw Base64 strings from the same value.
- The downloaded TXT keeps the full Data URI so the MIME type stays attached to the encoded bytes.
Formats and limits
| Input | JPG, PNG, WebP, and other browser-readable image files. |
|---|---|
| Output | Data URI, HTML <img>, CSS background-image, JSON string, raw Base64, and TXT download. |
| Transparency | Preserved because the original image bytes are encoded, not redrawn. |
| Animation | Preserved for formats where the original file bytes are encoded as-is. |
| Metadata | Preserved because Base64 wraps the original file bytes. |
| Batch and browser | Single-file utility; large photos produce very long strings. |
Real failure cases
- Huge files can create text too long for editors, CMS fields, or JSON fixtures.
- Base64 adds roughly one-third overhead compared with the original binary file.
- Clipboard writes can be blocked by browser permissions; TXT download remains available.
Example result to verify
| Original | A 24x24 PNG icon, 1.2 KB. |
|---|---|
| Target | CSS background-image copy mode. |
| Output | A data:image/png;base64 string around 1.6 KB, plus CSS syntax ready to paste. |
| Verify | Paste the CSS into a local page and confirm the icon renders without a network request. |
Best for
- Embedding small icons in HTML, CSS, or JSON.
- Creating quick test fixtures for frontend work.
- Turning a local image into a portable text value without uploading it.
What you get
- Copy buttons for Data URI, HTML image, CSS background, JSON string, and raw Base64.
- A Base64 data URL saved as a .txt file.
Before you download
- Base64 makes files roughly one-third larger than binary images.
- Large photos can produce very long text that is awkward to paste into code.