拖拽图片到此处，或点击选择图片
支持 JPG / PNG / GIF / WebP / SVG / BMP / ICO，也可直接 Ctrl+V 粘贴图片
图片预览
宽度：-
高度：-
大小：-
格式：-
Base64 编码结果
0 字符 / 0 B
代码片段
HTML <img> 标签
CSS background-image
Markdown
Base64 转图片
解码失败，请检查输入的Base64字符串是否正确
图片与 Base64 小知识
图片转Base64有什么用？
将图片转为 Base64 编码后，可以直接嵌入 HTML、CSS 或 JSON 中，无需额外的图片文件请求。常见场景：
- 小图标内联：CSS 中使用 Data URI 作为背景图，减少 HTTP 请求
- 邮件模板：邮件客户端不支持外部图片引用，需内嵌 Base64
- API 传输：在 JSON 中传输图片数据
- 单文件 HTML：将所有资源打包到一个 HTML 文件
什么时候不应该用 Base64？
Base64 编码会使数据体积增大约 33%，因此：
- 大图片（超过 10KB）不建议使用 Base64，会增加 HTML 体积，影响加载速度
- 频繁变动的图片不适合内联，每次修改都需要重新编码
- 需要浏览器缓存的图片不适合 Base64，无法单独缓存
经验法则：小于 10KB 的图标适合 Base64 内联，大图片应使用独立文件。
Data URI 和纯 Base64 有什么区别？
Data URI 包含完整的 data:image/xxx;base64, 前缀，可直接用于 HTML 的 src 属性或 CSS 的 url() 中。
纯 Base64 仅包含编码数据，需要自行拼接前缀才能使用。例如：
- Data URI：
data:image/png;base64,iVBORw0KGgo... - 纯 Base64：
iVBORw0KGgo...
支持哪些图片格式？
支持浏览器支持的所有图片格式，包括：
- JPG/JPEG：照片类图片，体积小
- PNG：支持透明通道，适合图标和截图
- GIF：支持动画
- WebP：现代格式，体积更小
- SVG：矢量图，无限缩放不失真
- BMP / ICO：位图和图标格式
如何将Base64转回图片？
使用本工具下方的 Base64 转图片 功能，粘贴 Base64 字符串即可预览图片。也可以：
- 在浏览器地址栏输入
data:image/png;base64,加上Base64字符串 - 在 HTML 中使用
<img src="data:image/png;base64,..." /> - 在 CSS 中使用
background-image: url(data:image/png;base64,...)
本工具的图片数据安全吗？
本工具所有处理均在浏览器本地完成，不会将您的图片上传到任何服务器，确保数据隐私安全。转换过程完全在内存中完成，关闭页面后数据即消失。