Image to Base64

图片 ⇄ Base64 转换器

图片转 Base64 Data URI 与反向还原，支持批量处理、CSS/HTML 代码生成。

Image to Base64

Convert images to Base64 Data URI, support batch processing and code generation

Runs locally · Nothing uploaded

Overview

Online image Base64 encoder/decoder tool that converts image files to Base64 Data URI format and restores Base64 strings to image previews. Ideal for frontend development scenarios like inlining small images, CSS background images, HTML img tags, and email template embedded images. Supports JPG, PNG, GIF, WebP, SVG, ICO and other common formats with batch processing. All conversions run locally in the browser for data privacy.

Features

  • Image to Base64 Data URI
  • Base64 to image preview
  • Supports JPG/PNG/GIF/WebP/SVG/ICO
  • Batch convert multiple images
  • One-click copy Base64 string
  • Generate CSS background-image code
  • Generate HTML img tag code
  • Local processing, no server upload

How It Works

  1. 1 Upload images: Drag files to upload area or click to select, multi-select supported
  2. 2 Auto encode: Tool reads file content and converts to Base64 encoding
  3. 3 Get results: Copy full Data URI (data:image/...;base64,...) or raw Base64 string
  4. 4 Preview verification: Click preview to view Base64 restored image
  5. 5 Code generation: One-click generate code snippets for CSS background-image or HTML img tags

Tips

  • Small icons (< 1KB) ideal for Base64 inlining to reduce HTTP requests
  • Escape quotes in CSS: background: url("data:image/png;base64,...")
  • Use full Data URI format for email template embedded images
  • Large images should use external links or CDN to avoid bloating HTML/CSS
  • SVG to Base64 retains vector scaling advantages as background images

Related tools

Tags ImageBase64Encode

FAQ

How much larger does Base64 make images?

Base64 encoding increases size by ~33% because every 3 bytes become 4 characters. Suitable for small icons/images; large images should use external links.

What image formats are supported?

Supports JPG/JPEG, PNG, GIF, WebP, SVG, ICO, BMP and all browser-recognizable image formats.

Base64 to image preview not showing?

Check if Base64 string is complete and includes correct MIME prefix (data:image/png;base64,...); tool auto-completes common prefixes.

Can I batch convert?

Yes, select or drag multiple files at once. Tool converts each and displays list with one-click copy all.

Difference between Data URI and raw Base64?

Data URI includes MIME type prefix (data:image/png;base64,) for direct use in src/href; raw Base64 is encoding only, requires manual prefix.

All Tools | 京ICP备16061460号-4 | Sitemap