Image to Base64. Inline images, zero upload.
Inline images, zero upload
Image to Base64 reads your files with the browser's own FileReader and turns them into Base64, with one-click snippets for data URIs, HTML <img> tags, CSS background-image rules and Markdown. Optionally re-encode to PNG, JPG or WebP with a quality slider to keep the payload small, and get a size warning when an output passes 1 MB. The reverse tab decodes any Base64 or data URI back into a downloadable image with automatic type detection. No server, no limits, completely free.
How to use the Image to Base64 converter
This converter turns image files into Base64 text, so you can paste an image straight into HTML, CSS, Markdown or JSON as a data URI instead of linking to a file. It can also go the other way and turn Base64 back into an image you can download. It is for developers and email builders who need small icons, logos or test images inline.
Step by step
-
Add one or more images
On the Image → Base64 tab, drop files on Drop images here or click it to browse. PNG, JPG, WebP, GIF and SVG all work, several at once, up to 30 MB per file. Each image gets its own result card and the options appear above them.
-
Keep the original or re-encode
Encoding source starts on Original file bytes (exact), which keeps the file as it is. Choose Re-encode → PNG, Re-encode → JPG or Re-encode → WebP to convert it first. For JPG and WebP, the Quality slider runs from 10 to 100% and starts at 80%.
-
Shrink large images
Type a number into Max width (px) to scale wider images down to that width, keeping the proportions. It only applies when you re-encode; with Original file bytes the size is left alone.
-
Set up the snippets
Fill in Alt text (HTML / Markdown), which otherwise uses the file name, and CSS selector wrap, such as .hero, to wrap the CSS rule in a selector. Tick width/height attributes in HTML (on by default), loading="lazy" in HTML, or wrap raw Base64 at 76 chars (MIME) as needed.
-
Copy or download
On each card, press Copy Base64, Copy data URI, Copy HTML, Copy CSS or Copy Markdown. Download .txt saves one image's snippet, and Download all (.txt) saves every image in one file, in the format chosen under Download .txt as. Clear removes all images.
-
Decode Base64 back to an image
Switch to the Base64 → Image tab and paste raw Base64 or a full data: URI into Paste Base64 or a data: URI. A preview appears and the file type is detected for you. Edit Output filename if you like, then press Download image or Copy data URI.
Reading the result
- Each card shows the pixel size, the original file size, the encoded size and type, then the length in Base64 characters and as a full data URI.
- Base64 uses 4 characters for every 3 bytes, so the text is about a third larger than the file. A 30 KB PNG becomes roughly 41,000 characters.
- An amber over 1 MB badge appears when a data URI passes about 1 MB of text. Images that size usually load faster as a normal file.
- On the decode tab, the line above the preview shows the decoded size, the detected type and the pixel size. It can detect PNG, JPG, GIF, WebP, BMP, ICO, AVIF and SVG, and sets the file extension to match.
Tips and common mistakes
- Re-encoding to JPG fills any transparent areas with white. Use PNG or WebP when you need to keep transparency.
- Re-encoding an SVG turns it into a bitmap at its natural size. Keep Original file bytes for SVGs you want to stay sharp at any size.
- Changing the alt text, selector or checkboxes does not re-run the conversion; the new settings are used the next time you copy or download.
- The decoder accepts URL-safe Base64, which swaps + and / for the minus sign and underscore, as well as line breaks and missing = padding, so you can paste strings copied from JSON or email source as they are.
Privacy and limits
Images are read and converted by your own browser and are never uploaded, and Base64 you paste is decoded on your device. Nothing is saved, so reloading the page clears everything. Files over 30 MB are refused, and very large outputs can make the page slow because the browser has to hold the whole text in memory.
Everything an encoder should do.
- Encode any image to Base64 instantly, drop PNG, JPG, WebP, GIF or SVG files and get a ready data URI in seconds.
- Copy one-click snippets for raw Base64, HTML
<img>tags, CSS background-image rules and Markdown image syntax. - Re-encode on the fly, convert to PNG, JPG or WebP with a quality slider and optional max-width to shrink the output before encoding.
- Batch-convert many images at once and download every result as a single .txt file.
- Decode Base64 back to an image, paste any Base64 string or data URI, preview it, and download the file with an auto-detected type.
- Private by construction, all processing runs in your browser; no files are uploaded and no server is involved.
Frequently asked questions.
Is Image to Base64 free?
Are my files uploaded anywhere?
What is a Base64 data URI, and when should I inline images?
data:image/…;base64,… string, so no separate network request is needed. It's ideal for tiny icons, email templates and single-file demos. Base64 adds roughly 33% to the file size, so for large or reused images a hosted file is usually faster, the tool flags any output over 1 MB.Can I re-encode or resize while converting?
Can it decode Base64 back into an image file?
Does it work offline?
Published · Last updated .
