图片转 Base64
将小于 300KB 的图片即时转换为 base64 字符串或 data URI，本地处理更安全
相关标签
图片转 Base64
图片转 Base64 工具
将小于 300KB 的 JPG、PNG、GIF、BMP 或 ICO 图片转为 base64 字符串或 data URI，在浏览器中预览并复制结果。
拖拽图片到此处
或点击选择文件
单文件限制：300KB
格式说明
支持 JPG、JPEG、PNG、GIF、BMP、ICO
仅允许小于 300KB 的图片。
使用提示
- 如超出 300KB，请先压缩或降低分辨率再转换。
- 编码过程完全在本地浏览器中完成。
- data URI 适合 HTML/CSS，纯 base64 更方便用于接口或 JSON。
图片预览
尚未选择图片
选择一张符合条件的图片即可预览并生成 base64。
把小图片编码为文本
选择或拖入一张 JPG/JPEG、PNG、GIF、BMP 或 ICO 图片，可获得纯 Base64 和完整 data URI。处理在浏览器本地完成。当前文件上限为 300 KiB，即 300 × 1024 字节；超过上限会被拒绝。编码不会自动缩放或压缩图片。
两种输出分别怎么用
| 输出 | 内容结构 | 典型用途 |
|---|---|---|
| 纯 Base64 | 只有图片原始字节的编码 | 明确要求 Base64 字段的接口 |
| Data URI | data:image/png;base64, 加上编码内容 | HTML 图片地址或 CSS URL |
两者对应相同的源文件字节，只是包装不同。接收方只接受纯编码时，多带一个 data URI 前缀也可能报错，应以目标接口要求为准。
使用步骤
- 点击选择图片，或将支持的文件拖入上传区域。
- 核对预览、文件大小、MIME 类型和宽高。
- 根据目标位置，点击纯 Base64 或 Data URI 对应的复制按钮。
- 粘贴到目标系统并在那里验证；不再使用当前结果时可清空。
一次只处理一个文件，替换图片会替换当前输出。文件名后缀正确，也不代表图片内容一定完整或能被浏览器预览。
放入 HTML 或 CSS 的示例
复制完整 data URI 后，将下面的占位内容连同尖括号一起替换为实际字符串：
<img src="<在这里粘贴完整data URI>" alt="状态图标" />
.status-icon {
background-image: url('<在这里粘贴完整data URI>');
}
写入 JSON 接口时，应按接口约定把文本放入字符串字段。编码不等于通过目标系统的身份认证、数据校验或上传大小限制。
编码体积、缓存与元数据
纯 Base64 的长度为 4 × ceil(原始字节数 / 3) 个字符，尚未包含 data URI 前缀。例如 300 字节的文件会生成 400 个编码字符。较大文件通常增加约三分之一体积，因此不能把编码当作图片压缩。
大量内联图片会增加 HTML/CSS 体积，并与所在资源共享缓存更新周期；独立图片文件则可以单独缓存。是否内联应根据实际交付需求决定，而不是认为所有小图片都更适合 Base64。
编码仍包含原始文件字节，包括文件中可能存在的元数据，不会自动去掉拍摄信息。本地生成不代表分享出去后仍然保密，粘贴到其他平台前仍需确认内容。
排错与相关工具
文件过大时，可先用图片压缩工具处理，再核对新文件的格式和体积。输出无法显示时，检查字符串是否完整、选用的输出形式是否正确，以及目标环境是否允许 data URI。已有编码可以用 Base64 转图片工具解码复核。