Is my image uploaded anywhere?

No. The image is read locally with your browser's FileReader and encoded in memory — it is never uploaded, stored or seen by anyone.

Is the data URI an exact copy of my image?

Yes. FileReader encodes the original file bytes as base64 without re-compressing, so the embedded image is byte-for-byte identical to the file you selected.

Why is the data URI bigger than my file?

Base64 encoding adds roughly 33% to the size, so data URIs suit small icons and inline assets rather than large photos, where a normal file link is more efficient.

What output formats can I copy?

You can copy the raw data URI, a ready-made HTML img tag with the URI as its src, or a CSS background-image rule, so it drops straight into whatever file you are editing.

Do data URIs work in email?

They work in most web pages and many email clients, but some email clients (notably parts of Outlook) block or strip inline base64 images, so test before relying on them for newsletters.

What image formats are supported?

Any format your browser can read as a file — JPEG, PNG, WebP, GIF, SVG and more. The MIME type in the data URI is taken from the file you select, so the encoding matches the original format.

What is the Image to Base64 Data URI?

Free image to base64 data URI converter. Encode any image as a data:image/...;base64 string ready to paste into HTML, CSS or Markdown. Privacy-first — your image is read locally and never uploaded. It runs free in your browser on Gera Tools, with nothing uploaded.

Image to Base64 Data URI

Name: Image to Base64 Data URI
Creator: Gera Tools
License: https://creativecommons.org/licenses/by/4.0/

Get one useful tool a week

Like this tool? Enter your email and we'll send you one genuinely useful Gera tool a week — plus a link to come back to this one. No spam, one-click unsubscribe any time.

What a data URI is and when to use one

A data URI embeds a file’s binary content directly inside a text string, formatted as data:[MIME type];base64,[encoded bytes]. Instead of linking to a separate image file with a URL, you put the image itself into your HTML, CSS, Markdown, or JSON. The browser decodes and renders it identically to a regular image link — no extra HTTP request needed.

Practical uses include:

Email templates: embed small logos and icons so they appear even when an email client blocks external image requests.
Self-contained HTML files: a single .html file that contains all its images without needing a folder of assets alongside it.
Offline or local demos: no server required; the images travel with the markup.
CSS sprites replacements: a single small icon as a CSS background-image without a separate image file.
Markdown with embedded images: some tools (Obsidian, Notion exports) accept data URIs directly in Markdown image syntax.

How this tool generates the URI

The browser’s FileReader.readAsDataURL reads your file’s raw bytes and encodes them as base64 without re-compressing or altering the image. The output format is:

data:[MIME type];base64,[base64 encoded bytes]

For a PNG icon: data:image/png;base64,iVBORw0KGgoAAAANS...

The tool then wraps that URI in your chosen output format:

Output option	Result
Raw data URI	`data:image/png;base64,...`
HTML img tag	`<img src="data:image/png;base64,..." alt="">`
CSS background	`background-image: url("data:image/png;base64,...")`

The size overhead

Base64 encoding represents 3 bytes as 4 characters, adding roughly 33% to the original file size. A 1.2 KB icon becomes about a 1.6 KB string in the page. For small icons and tiny graphics, this overhead is negligible and the trade-off of eliminating a network request often wins.

For large photographs (50 KB+), the 33% overhead and the cost of embedding a large string into your HTML source usually makes a normal image URL a better choice. Data URIs also cannot be cached independently by the browser — the parent document must be re-fetched to get an updated version.

Browser and email client support

All major web browsers support data URIs in <img> tags and CSS background-image. In email, support is broader than it used to be, but some clients (parts of Microsoft Outlook on Windows) may block or strip inline base64 images — always test in your target email clients before relying on data URIs for marketing emails.

Your image is read locally with the FileReader API and is never uploaded, stored, or transmitted anywhere.