Image Tools

Image Base64

Convert images to and from Base64 Data URLs.

Choose image
💡 Usage
Data URL format:data:image/png;base64,iVBORw0KGgoAAAANS...

Use in HTML img src or CSS background-image

Base64 plain text:iVBORw0KGgoAAAANS...

Only the Base64 string—add the prefix manually when needed

What is Image to Base64?

Image to Base64 converter encodes images as Base64 strings for embedding directly in HTML, CSS, or JSON.

Features

  • Drag and drop support
  • Multiple format support
  • Data URI output
  • Copy to clipboard

Use Cases

  • Inline images in HTML/CSS
  • Email templates
  • Reducing HTTP requests

Tips

  • Best for small images (< 100KB)
  • Large images increase page size
  • All processing is done locally

Frequently Asked Questions

When should an image be inlined as Base64?
Small assets under roughly 2–3 KB: icons, logos, loading placeholders — it saves a request and caches with the document. Not for content images or large files: +33% size, no independent caching, CSS parsing bloat. Rule of thumb: if it would be in a sprite, consider inlining.
Does inlining images hurt page performance?
Both ways: fewer requests, but no caching — every referencing page re-downloads the whole CSS/HTML — plus parsing bloat. Lighthouse flags large Base64 segments. The middle path: inline SVG for small icons, files with lazy-loading for photos.
Why does my converted image "not open"?
Usually a usage mismatch: saving raw Base64 as a .jpg file (no binary header), or a Data URI whose MIME type contradicts the real format (png labeled jpeg). This tool attaches the correct MIME prefix on output and detects the type when decoding back.