图转 Base64

生成 Data URL，可复制纯 Base64 或完整 `data:image/...` 字符串。

拖拽或点击选择图片 本地编码，不上传
预览

在线图片转 Base64 工具介绍

这是一款免费的在线图片转 Base64 编码工具，可将任意图片转换为 Base64 字符串或完整的 Data URL（data:image/...）。适合前端开发者将小图标内嵌进 HTML/CSS 减少请求，也方便邮件内嵌图片、JSON 配置传递图片数据。所有编码在浏览器本地完成，图片不上传服务器。

主要功能

  • 支持 JPG / PNG / WebP / GIF / SVG 等所有浏览器支持的图片格式
  • 输出可选：纯 Base64 字符串 或 完整 Data URL（data:image/xxx;base64,...）
  • 一键复制结果到剪贴板
  • 显示编码后字符串长度，便于评估
  • 编码后图片实时预览，验证可用性
  • 纯本地处理，原图不上传

使用方法

  1. 拖拽或点击选择本地图片
  2. 在「输出内容」下拉中选择「纯 Base64」或「Data URL」
  3. 点击「开始编码」按钮
  4. 结果会显示在文本框中，可点击「复制」直接复制到剪贴板
  5. 下方可预览编码后的图片，确认无误

常见问题

Base64 编码后图片体积会变大吗？
会。Base64 编码后字符串体积约为原图的 1.33 倍（每 3 字节变成 4 字符）。但内嵌到 HTML/CSS 中可减少一次 HTTP 请求，对于小图标（< 4KB）总体是有益的。
应该用纯 Base64 还是 Data URL？
CSS background-image、HTML <img src>、JSON 配置请用完整 Data URL（带 data:image/xxx;base64, 前缀）；如果只是要存数据库或单独传递编码内容，用纯 Base64 字符串。
支持多大图片？
没有硬性限制，但建议不超过 1MB。Base64 后字符串约为 1.33MB，超过这个大小浏览器、邮件系统、JSON 解析都可能出问题。大图请直接用 URL 引用。
Base64 能反向解码回图片吗？
可以。Base64 是双向编码，可在任意支持 Base64 解码的工具（如浏览器、Python、Node.js）还原为原图片二进制。本工具目前仅做编码，反向解码可用其他工具。

注意事项

  • Base64 后体积增大约 33%，不建议用于大图（> 100KB）
  • Data URL 格式必须包含 MIME type（如 data:image/png;base64,...）
  • 邮件内嵌图片需用 Data URL 格式，且部分邮件客户端有大小限制
  • CSS 中使用 Base64 时，建议加注释标明原始文件名，便于维护
  • Base64 字符串中不要插入换行或空格，否则解码会失败