Image to Base64 Converter
Image to Base64 turns a picture into a Base64-encoded text string you can paste straight into your code. Drop in a JPEG, PNG, WebP, GIF, SVG, BMP, or ICO file and get an inline data URI ready for HTML, CSS, email, or JSON — no separate image file needed.
It works both ways. Encode an image into Base64 in your chosen output format, or switch to the Base64 to Image tab to paste a Base64 string and download it back as a real image file.
How to Convert an Image to Base64
Add your image
On the Image to Base64 tab, drag and drop an image onto the upload area or click it to pick a file. A preview appears with the file Name, Type, Size, and Dimensions.
Choose an output format
Switch between Data URI, Raw Base64, CSS background, and HTML <img>. The output and its size comparison update instantly.
Copy or download
Click Copy to send the string to your clipboard, or Download .txt to save it as a text file. Use Change image to start again with a different file.
Decode back to an image
Open Base64 to Image, paste a Base64 string (with or without the data:image/... prefix), and the preview appears automatically. Click Download Image to save it.
Features
Drag-and-Drop Encoding
Drop an image onto the upload area or click to browse, and it is converted to Base64 the moment it loads.
Multiple Output Formats
Get Data URI, Raw Base64, a CSS background-image rule, or a complete HTML <img> tag with one click.
Base64 to Image Decoding
Paste a Base64 string to preview the image and download it back as a real file in its original format.
Auto-Detect Data URI
Decoding accepts a full data URI or just the raw Base64 — the prefix is detected automatically, no cleanup needed.
File Info at a Glance
See the image name, MIME type, file size, and pixel dimensions alongside the live preview.
Size Comparison
Compare the original file size with the encoded output, so you know whether Base64 embedding is worth it.
Broad Format Support
Works with JPEG, PNG, WebP, GIF, SVG, BMP, and ICO images in a single tool.
Copy or Download
Copy the result to your clipboard or save it as a .txt file, and load a sample string to try decoding.
Frequently Asked Questions
How do I convert an image to Base64?
On the Image to Base64 tab, drag and drop your image or click to select a file. It is encoded instantly — then choose Data URI, Raw Base64, CSS, or HTML output and click Copy or Download .txt.
How do I use a Base64 image in HTML?
Pick the Data URI output and put it in an image tag's source, like <img src="data:image/png;base64,iVBOR...">. Or choose the HTML <img> format to copy a complete, ready-to-paste tag.
How do I use a Base64 image in CSS?
Select the CSS output format. It produces a background-image: url(data:image/...); rule that embeds the image directly in your stylesheet — handy for small icons and UI patterns.
Is a Base64 image bigger than the original?
Yes. Base64 encoding adds roughly 33% to the data size, so a 100 KB image becomes about 133 KB. The size comparison shows the exact change. Embedding suits small images like icons and logos; serve large photos as separate cached files instead.
What is a Data URI?
A Data URI embeds data inline using the form data:[media-type];base64,[data]. For images it looks like data:image/png;base64,iVBOR... and can be dropped straight into an HTML src attribute or a CSS url() value.
How do I decode Base64 back to an image?
Open the Base64 to Image tab and paste your string — a full data URI or just raw Base64 both work, as the prefix is detected automatically. The preview appears with its type, dimensions, and size, and Download Image saves it as a file.
Does my image stay on my device?
Yes. All encoding and decoding runs in your browser with JavaScript. Your images and Base64 strings are never uploaded to a server, so your data stays private on your own device.
No comments yet. Be the first to comment!