返回首页
图片 ↔ DataURL 双向互转 · 本地转换不上传
📷
点击选择图片(PNG/JPG/SVG/WebP/GIF)
适合小图标、小图片,本地转换不上传
💡 为什么 Base64 后体积变大?Base64 用 64 个可见字符表示二进制,每 3 字节编码为 4 字符,体积约增加 33%。因此只建议小图标(<10KB)内嵌,大图片应保持文件引用以利用缓存。

Base64 图片的用法与适用场景

常见问题

为什么转完图片反而更大了?
Base64 编码天然膨胀约 33%,它的价值是"免请求、可内嵌"而非压缩;小图标省下一次HTTP请求的收益大于体积增加,大图则相反。
复制到代码里图片不显示?
检查是否完整复制了 data:image/png;base64, 前缀;CSS 中注意引号和括号转义;超长字符串不要在中间换行。
GIF 动图转了还能动吗?
可以,DataURL 完整保留 GIF 数据,内嵌后动画正常;但动图通常较大,内嵌前请权衡体积。