1. Home
  2. Image
  3. Image to Base64

Image to Base64

Turn an image into a Base64 data URL, with ready-to-paste HTML, CSS, Markdown and JSON.

Runs in your browser
Drop an image herePNG, JPG, WebP, SVG, GIF and more. You can also paste. It stays on your device.

What is the Image to Base64?

A data URL puts an image directly inside HTML, CSS, JSON or an email template, so no separate file has to be hosted or loaded. It is handy for small icons, logos in email signatures, test fixtures and API payloads that expect Base64.

Base64 makes data about a third larger, so it suits small images best. This tool can shrink and convert the image to WebP, JPG or PNG first, and shows the size of the result so you can decide whether inlining is worth it.

How to use it

  1. Drop an image on the box, click to choose one, or paste it.
  2. Optionally convert it or limit its width to make the code shorter.
  3. Copy the format you need: data URL, raw Base64, HTML, CSS, Markdown or JSON.

Example

Input
logo.png (1.2 KB)
Output
data:image/png;base64,iVBORw0KGgo…
<img src="data:image/png;base64,…" alt="logo">

Features

  • Six ready formats. Data URL, plain Base64, HTML img tag, CSS background, Markdown and JSON.
  • Shrink first. Convert to WebP or JPG and limit the width to keep the code short.
  • Size check. See the Base64 size and a warning when an image is too big to inline.
  • SVG and transparency. Works with PNG, WebP and SVG, keeping transparency.
  • Private. The image is encoded in your browser and never uploaded.

Frequently asked questions

When should I use a Base64 image?

For small images (under about 10 KB) that must travel with the code: icons in CSS, logos in HTML emails, images in JSON or test data. For large photos, a normal image file is faster because browsers can cache it.

Why is the Base64 bigger than my file?

Base64 uses four characters for every three bytes, so it is about 33% larger. Converting to WebP or reducing the width first more than makes up for it.

Do data URLs work in email?

Many email apps, including Gmail, block or strip data URLs in emails. For email signatures, hosting the image is more reliable.

How do I turn Base64 back into an image?

Use the Base64 Decoder: paste the data URL and it shows and downloads the image.

Is my image uploaded?

No. Encoding happens in your browser.

Last updated · Free, no sign-up, runs in your browser.

Free for everyone, kept free by you.

No paywall, no sign-up and no watermarks. If a tool saved you time, you can chip in any amount by UPI to keep Nova Free Tools running.

Esc
↑↓ move↵ openEsc close