Image to Base64 Converter
Turn any image into a Base64 data URI you can paste straight into HTML, CSS or JSON. The whole conversion runs in your browser — the file is never uploaded, so it works offline and nothing is stored anywhere.
Drop your image here
or click to browse · Ctrl+V to paste
Tip: the Data URI works anywhere a normal image URL does — paste it in
the address bar to check it, or into an src attribute.
How to convert an image to Base64
- Add your image. Drop it on the box, click to browse, or press Ctrl+V to paste one straight from your clipboard.
- Pick an output format. Data URI for general use, CSS background for a stylesheet, HTML img for a page, Markdown for a README, or raw Base64 if you are feeding it to code yourself.
- Copy or download. Copy puts it on your clipboard; download saves it as a .txt file, which is easier when the string is very long.
What Base64 encoding actually does
An image on disk is binary. Plenty of places cannot carry binary safely — a stylesheet, a JSON payload, an email template, a YAML config. Base64 rewrites those bytes using 64 plain text characters, so the data survives anywhere text survives.
The cost is size. Every three bytes of the original become four characters, so the encoded string is about 33% larger than the file. That is why Base64 suits icons and small logos and is a poor fit for photographs. The converter shows the exact overhead for your file, so it is a measured decision rather than a guess.
A data URI adds the wrapper the browser needs: the MIME type and the encoding, written as
data:image/png;base64,…. With that prefix in place the string behaves exactly
like a URL pointing at an image file.
When Base64 is the right choice
- Icons and small logos inlined in CSS, saving a request each.
- Single-file HTML that has to work when emailed or opened from a USB stick.
- Email signatures, where an external image is often blocked by the client.
- Offline documentation and exported reports with no network access.
- SVG assets, which are text already and inline cleanly.
- Test fixtures and seed data, where an image has to live inside a JSON file.
And when it is not: large photographs, anything reused across many pages (the browser can cache a real file but not a string repeated in five stylesheets), and anything a CDN should be serving.
Nothing is uploaded
This converter uses the browser's own FileReader, so your image is read from disk into memory on your machine and encoded there. No request is made, no copy is stored, and there is nothing on our side to delete afterwards. If you want to verify it, load this page, switch off your connection and convert a file — it still works.
That matters for anything you would not upload to a stranger's server: internal screenshots, client artwork, documents with names in them, or a logo under NDA.
Related tools
Working with images and links usually means a couple of other jobs: Image to URL Converter hosts a file and returns a CDN link plus a QR code, Image Metadata Viewer reads the EXIF data inside a photo, Image Alt Extractor pulls alt text out of a page, and Bulk URL Opener opens a whole list of links at once. The Web Tools Hub has the rest.
Frequently asked questions
What is a Base64 image?
Base64 is a way of writing binary data using only plain text characters. A Base64 image is the picture itself rewritten as a long string, usually wrapped in a data URI that starts with data:image/png;base64. Because it is text, you can paste it straight into HTML, CSS, JSON or a config file and the browser rebuilds the image from it — no separate file and no second request.
Are my images uploaded when I convert them here?
No. The conversion happens entirely inside your browser using the FileReader API. The file never leaves your device, is never sent to our server and is never stored. You can disconnect from the internet after the page loads and the converter still works.
When should I use Base64 instead of an image URL?
Use Base64 for small assets that must travel with the code: icons, logos, email signatures, single-file HTML pages, or anything that has to work offline. Use a hosted image URL for photos, anything large, and anything you want to reuse in several places. Base64 makes a file roughly 33% bigger, so it is the wrong tool for a big photograph.
How much bigger does Base64 make my image?
About 33% larger, because every three bytes become four text characters. The converter shows you the original size, the encoded size and the exact overhead so you can decide before you paste a huge string into your stylesheet.
Can I use the Base64 string in CSS?
Yes. Switch the output format to CSS background and you get a ready background-image rule with the data URI already inside url(). Paste it into your stylesheet and the image renders with no extra HTTP request.
Which image formats can I convert to Base64?
Any format your browser can read, which in practice covers PNG, JPG, JPEG, GIF, WebP, AVIF, SVG, BMP and ICO. SVG is a particularly good fit, because it is already text and Base64 keeps it inline without a separate file.
Is there a size limit?
The tool does not impose one, but the browser has to hold the whole string in memory and encoded output grows by a third. Anything past a few megabytes becomes unwieldy to paste into source code. For large images, host the file and use an image URL instead.
Can I convert a Base64 string back into an image?
Yes, in any browser: paste the full data URI into the address bar and press enter. The image opens directly, and you can then save it. Nothing needs to be uploaded for that either.
Related tools
Browse all Sigma Wire tools - every free tool on the site, grouped by category.