Image to Base64
Turn an image into a Base64 string or data URI you can paste straight into CSS or HTML.
or drop images here
Up to 30 MBYour images are processed in your browser and never uploaded- 1Choose
Choose an image.
- 2Adjust
Choose the output: plain Base64, data URI, CSS background or an HTML img tag.
- 3Download
Copy it with one click.
How to use Image to Base64
Pick the form you are going to paste
A data URI goes straight into src="…" or a CSS url(). Plain Base64 is for JSON payloads and config files. The ready-made CSS background-image and HTML <img> lines are there when you just want to drop a working line into a file. One click copies whichever you chose.
Keep it small
Base64 is about a third larger than the file it encodes, and it sits inside your HTML or CSS instead of being cached as a separate file. Inlining pays off under 10 KB, for small icons, placeholders and spacers; above 50 KB the tool warns you, because the page will start loading more slowly.
Alternatives worth knowing
An SVG is usually better pasted as markup than as Base64: it stays editable, styleable and compresses better. And anything that appears on more than one page is better off as a normal image file that the browser can cache once and reuse.
Questions
Are my photos uploaded to a server?
No. Everything runs inside your browser, so your photos never leave your device. Close the tab and nothing is left behind.
How large an image is sensible for Base64?
As a rule, under 10 KB. Base64 is about 33% larger than the original file, so inlining big images slows the page down.