图片转 Base64 即时数据 URI。

拖入图片，即可获得适用于 CSS、HTML、JSON 或电子邮件的即用型数据 URI。完全在您的浏览器中运行。

如何转换

拖入任何 PNG、JPG、GIF、SVG 或 WebP 文件。

完整的 data:image/...;base64,... 字符串将出现在输出框中。

用于 CSS url()、HTML <img src> 或 JSON 配置中。

嵌入 1KB 以下的图标，避免额外的网络请求。

在无法链接外部资源时使用。

消除关键背景图片的额外 HTTP 请求。

将图片打包到源代码中，实现完全离线使用。

什么是 base64 图片编码？

Base64 将二进制数据编码为 ASCII 文本，允许您直接将图片嵌入 CSS、HTML 或 JSON 中。

何时应该使用 base64 而不是 URL？

适用于微型图片、电子邮件或内联 CSS。对于较大的图片，请使用托管 URL，因为 base64 会使文件大小增加约 33%。

为什么 base64 字符串这么长？

Base64 每 3 个字节占用 4 个字符，会有约 33% 的额外开销。

文件会上传吗？

不会。使用本地 FileReader.readAsDataURL 调用。

支持 SVG 编码吗？

支持。对于 SVG，URL 编码有时体积更小。

如何在 CSS 中使用？

粘贴到 url() 中 — background-image: url('data:image/png;base64,...')。

如何在 HTML 中使用？

放入 img src 中：<img src="data:image/png;base64,...">。

有文件大小限制吗？

浏览器对内联数据 URI 的实际限制约为 2 MB。

对于大于 2 KB 的图片，使用 CDN URL 速度更快。