图片转 Base64
将图片转换为 Base64 Data URI——适合嵌入代码使用
🔒 你的图片绝不会离开你的设备。 所有处理都通过 FileReader API 在浏览器本地完成。无上传、无服务器、无追踪。
功能特点
- Data URI 输出 — 获取完整的 data:image/... URI 字符串，可直接粘贴到 HTML、CSS 或 JavaScript 中。
- 一键复制 — 复制为原始 Data URI、<img> 标签或 CSS background-image 属性。
- 大小对比 — 查看原始文件大小与 Base64 字符串长度的对比（Base64 约大 33%）。
- 即时转换 — 转换立即完成——无需处理时间。
使用方法
- 上传图片 — 拖入任意图片即可转换为 Base64。
- 选择复制格式 — 复制为 Data URI、<img> 标签或 CSS background-image。
- 粘贴到代码中 — Base64 字符串将图片直接嵌入代码——无需额外文件。
使用场景
- 将小图片直接嵌入 HTML 以减少 HTTP 请求
- 在 HTML 邮件中内嵌图片，无需外部加载即可显示
- 在 CSS 样式表中嵌入背景图片
- 在 JavaScript 代码中打包图标，实现单文件分发
常见问题
什么时候应该使用 Base64？
适用于小图片（10KB 以下）——图标、logo、小型 UI 元素。嵌入可以减少额外的 HTTP 请求。对于较大的图片，建议作为独立文件提供。
为什么 Base64 字符串比原文件大？
Base64 编码会使体积增加约 33%，因为它将二进制数据转换为 ASCII 文本。这是为了能将图片直接嵌入代码而做的权衡。
图片质量会完整保留吗？
会的。Base64 只是同一二进制数据的不同编码方式——完全没有画质损失。