图片转 Base64

图片 ⇄ Base64 转换器

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

图片转 Base64

在线将图片转为 Base64 Data URI，支持批量处理、生成 CSS/HTML 代码

本地运行 · 数据不上传

详细说明

在线图片 Base64 编解码工具，支持将图片文件转换为 Base64 Data URI 格式，也支持将 Base64 字符串还原预览为图片。适用于前端开发中内联小图片、CSS 背景图、HTML img 标签、邮件模板嵌入图片等场景。支持 JPG、PNG、GIF、WebP、SVG、ICO 等常见格式，批量处理多张图片，所有转换在浏览器本地完成，保护数据隐私。

功能特点

  • 图片转 Base64 Data URI
  • Base64 还原为图片预览
  • 支持 JPG/PNG/GIF/WebP/SVG/ICO
  • 批量转换多张图片
  • 一键复制 Base64 字符串
  • 生成 CSS background-image 代码
  • 生成 HTML img 标签代码
  • 本地处理，不上传服务器

使用方法

  1. 1 上传图片：拖拽文件到上传区或点击选择文件，支持多选
  2. 2 自动编码：工具读取文件内容并转换为 Base64 编码
  3. 3 获取结果：复制完整的 Data URI (data:image/...;base64,...) 或纯 Base64 字符串
  4. 4 预览验证：点击预览按钮查看 Base64 还原的图片效果
  5. 5 代码生成：一键生成可直接用于 CSS background-image 或 HTML img 标签的代码片段

使用技巧

  • 小图标 ( < 1KB ) 适合内联为 Base64，减少 HTTP 请求
  • CSS 中使用需注意转义引号：background: url("data:image/png;base64,...")
  • 邮件模板嵌入图片时建议使用完整 Data URI 格式
  • 大图片建议使用外链或 CDN，避免 HTML/CSS 体积过大
  • SVG 转 Base64 后可直接作为背景图，保持矢量缩放优势

相关工具

标签 图片Base64编码

常见问题

Base64 图片会变大多少？

Base64 编码后体积约增加 33%，因为每 3 字节变为 4 个字符。适合小图标、小图片内联，大图建议外链。

支持哪些图片格式？

支持 JPG/JPEG、PNG、GIF、WebP、SVG、ICO、BMP 等浏览器可识别的所有图片格式。

Base64 转图片预览不显示怎么办？

检查 Base64 字符串是否完整，是否包含正确的 MIME 前缀 (data:image/png;base64,...)；工具会自动补全常见前缀。

可以批量转换吗？

支持，一次选择或拖拽多个文件，工具会逐个转换并显示列表，支持一键全部复制。

Data URI 和纯 Base64 有什么区别？

Data URI 包含 MIME 类型前缀 (data:image/png;base64,)，可直接用于 src/href；纯 Base64 仅编码内容，需自行拼接前缀。

全部工具 | 京ICP备16061460号-4 | 网站地图