Image to Base64 Converter
Upload an image
Drag & drop, click to browse, or paste from clipboard (Ctrl+V)
Free Online Image to Base64 Converter
A fast, two-way Base64 image converter that runs entirely in your browser. Encode any image into a Base64 string and copy it in the exact format you need — raw Base64, Data URI, CSS background, HTML <img> tag, Markdown or a JSON/JS snippet. Need to go the other way? Paste a Base64 string to instantly preview and download the original image. Everything is processed locally, so your files never leave your device.
How to use the converter
Choose 'Image → Base64' to encode an image, or 'Base64 → Image' to decode a string back into a downloadable picture.
Drag & drop an image, click to browse, or paste from the clipboard with Ctrl+V. In decode mode, paste your Base64 string or full Data URI.
Select Data URI, Raw Base64, CSS, HTML, Markdown or JSON. The result and live stats — size, character count and size increase — update instantly.
Copy the formatted output to your clipboard or download it as a file. When decoding, preview the image and save it with the correct extension.
Key Features
Encode images to Base64 and decode Base64 strings back into real images — both directions in a single tool.
Get ready-to-paste output as Data URI, Raw Base64, CSS background, HTML <img>, Markdown or a JSON/JS variable.
Press Ctrl+V to paste a screenshot or copied image straight from your clipboard — no saving the file first.
Drag & drop, click to browse, or paste. A fully keyboard-accessible drop zone with clear drag feedback.
See output size, character count, the ~33% size increase, original file size, MIME type and pixel dimensions at a glance.
All encoding and decoding happens locally in your browser. Nothing is uploaded and no data is ever stored.
Conversion is immediate as soon as you add an image — no waiting, no processing queue, no sign-up.
Convert as many images as you want, completely free, with no account, watermarks or hidden limits.
Popular Use Cases
Embed small icons, logos or background images directly in your stylesheet or markup to cut HTTP requests.
Attach images inside HTML emails without hosting separate files, so they render even when remote images are blocked.
Save images as text inside JSON, localStorage or a database when a binary file isn't practical.
Paste a Base64 string from an API response, log or source file and turn it back into a downloadable image.
Drop Data URIs into React, Vue or Angular components for tiny static assets that ship with your bundle.
Quickly verify what a mysterious Base64 string actually contains while debugging code or network payloads.
Frequently Asked Questions
Are my images uploaded to a server?
No. The converter runs entirely in your browser using the FileReader and Canvas APIs. Your images and Base64 strings never leave your device and nothing is stored.
Why is the Base64 string larger than my image?
Base64 represents binary data with text, which adds roughly 33% to the size. That's why it's best for small assets — the tool shows the exact size increase for every image.
How do I use the Base64 in my code?
Use the Data URI format directly: in HTML write <img src="data:image/png;base64,...">, in CSS write background-image: url("data:image/png;base64,..."). The CSS, HTML and Markdown output options build these for you.
Can I convert a Base64 string back into an image?
Yes. Switch to 'Base64 → Image', paste a raw Base64 string or a full Data URI, click Convert, then preview and download the image. The tool auto-detects JPG, PNG, GIF, WebP, SVG and BMP.
Which image formats are supported?
JPEG/JPG, PNG, GIF, WebP, SVG, BMP and ICO. For decoding, the correct file extension is detected automatically from the data.
When should I avoid using Base64 images?
Avoid it for large images (over ~100KB) and anything reused across many pages, since inlined images can't be cached separately and inflate your HTML or CSS. Use normal image files in those cases.
Whether you're inlining a tiny icon, building an HTML email, storing an image as text or decoding a Base64 string back into a picture, this converter handles both directions instantly and privately. All processing happens locally in your browser — no uploads, no limits, no data stored — making it a fast, secure tool for developers and designers alike.