Why is the Base64 string larger than the file?

Base64 encodes 3 bytes as 4 characters, so the text is about 33% larger than the binary file. Inline small icons; keep big photos as normal image files.

When should I inline an image as Base64?

For small icons and logos under about 5 KB, for HTML emails, and for single-file documents that must work offline. Large inline images slow first paint because they cannot be cached separately.

Does this work for SVG?

Yes. SVG encodes fine as a data URI, though for CSS a URL-encoded SVG is usually smaller than Base64.

Image to Base64

Encode any image as Base64 and copy it in the exact form you need: a raw Base64 string, a full data: URI, an HTML img tag, a CSS background-image rule, or Markdown image syntax. The tool shows how much the encoding inflates the file so you can decide whether inlining is worth it. Useful for email signatures, single-file HTML, CSS sprites, and test fixtures.

Drop an image to encode as Base64

or click to browse — you can also paste with Ctrl/Cmd+V

PNG, JPG, WebP, GIF, AVIF, or SVG — nothing is uploaded

Your image is processed in this browser tab with the Canvas API. It is never uploaded, stored, or sent to a server.

How to Use Image to Base64

Drop or paste the image you want to encode.
Choose the output you need: data URI, raw Base64, HTML, CSS, or Markdown.
Press Copy and paste it into your code.

Frequently Asked Questions

Why is the Base64 string larger than the file?: Base64 encodes 3 bytes as 4 characters, so the text is about 33% larger than the binary file. Inline small icons; keep big photos as normal image files.
When should I inline an image as Base64?: For small icons and logos under about 5 KB, for HTML emails, and for single-file documents that must work offline. Large inline images slow first paint because they cannot be cached separately.
Does this work for SVG?: Yes. SVG encodes fine as a data URI, though for CSS a URL-encoded SVG is usually smaller than Base64.

Related Tools

Image Resizer

Resize an image to any width and height in your browser. Free online image resizer with aspect-ratio lock, percentage presets, and PNG, JPG, or WebP output.

Image Compressor

Compress JPG, PNG, and WebP images in your browser. Set a target size in KB or pick a quality level and cut file size by up to 90%.

Image Converter (PNG, JPG, WebP)

Convert images between PNG, JPG, and WebP in your browser. Free bulk image converter — drop several files at once, no upload, no signup.

Image Cropper

Crop an image online with a draggable box and aspect-ratio presets for 1:1, 16:9, 4:5, and more. Free, browser-based, no upload.

About Image to Base64

Convert an image to a Base64 data URI, HTML <img> tag, CSS background, or Markdown snippet. Free browser-based encoder. This tool runs entirely in your browser, so your content is not sent to a server. MarkdownMe provides free, fast, and reliable Markdown tools for developers, writers, and anyone who works with Markdown.