Image → Base64

What it's for

Turn an image file into Base64 text, so it can be embedded directly in HTML, CSS, JSON, Markdown or an email template without a separate file.

For example, when you want a small icon or logo inside a single self-contained HTML file, convert it here and use the result as the image’s src.

How to use it

Choose an image file, drop one on the page or paste one (a screenshot, say). The Base64 appears straight away with a preview, along with the file’s size and the length of the Base64. Leave Include the data:image/…;base64, prefix ticked to get a complete data URL that works in <img src="…"> or CSS url(…); untick it for just the Base64, as most APIs and JSON fields expect. Then use Copy.

Example

Choose any PNG image with the prefix ticked. The result starts with:

data:image/png;base64,iVBORw0KGgo

Every PNG starts this way, because those characters encode the file’s PNG signature. A JPEG starts data:image/jpeg;base64,/9j/.

Good to know

Base64 is about a third larger than the original file, so it suits small images such as icons. Large photos make pages and files heavy. The image never leaves your browser.