按照此示例操作，然后将相同的控件应用于您自己的图像。 打开 图像转 Base64 转换器.
选择一张图像并预览其标识
打开“图像转 Base64”转换器。选择一张图像或尝试一个示例。该示例使用 512 × 512 像素的 favicon-orbit.png，其中包含 202,491 字节。编辑器在代码上方显示图像，以便您确认已选择预期的资源。
当浏览器可以解码以进行预览时，支持 PNG、JPG、WebP、GIF、BMP 和 AVIF。最大文件大小为 25 MB，限制为 60 百万像素和每边 16,000 像素。此光栅转换器不接受 SVG 标记。
该工具读取原始文件字节。它不会使用预览来重建、调整大小或重新压缩图像。因此，现有的元数据和 GIF 动画会保留在编码数据中。
编码前，如果需要更小的资源，请使用“调整图像大小”或“图像压缩器”。Base64 本身不会减小图像大小。
选择项目预期的表示形式
打开设置，在此示例的“代码格式”下选择 HTML 图像。结果是一个包含 Base64 Data URL 的 img 标签。alt 属性最初为空；当图像传达信息时，请编写有用的替代文本。
Data URL 以 data:image/png;base64 等前缀开头，后跟编码数据。纯 Base64 仅包含数据。CSS 背景将 Data URL 包装在 background-image 声明中。这些表示形式服务于不同的目标，因此请复制应用程序请求的格式，而不是仅更改文件名。
更改代码格式后，代码面板会立即更新。复制图标会复制当前的表示形式并给出已复制的确认提示。当剪贴板访问被阻止时，代码会被选中以便手动复制。
完整的 HTML img 标签与数据 URL 并非同一概念。当字段要求输入 URL 时，请仅使用 src 值。
本指南中的示例
尝试示例：favicon-orbit.png，512 × 512 px，202,491 字节。在代码格式下选择 HTML 图像。选择“开始”并下载 favicon-orbit-base64.txt。
- 原始 PNG
- 512 × 512 px · 202,491 字节
- HTML 文本输出
- 270,029 字节
- 编码
- 原始字节；不进行重新压缩
下载代码并了解其大小
选择“开始”，然后选择“下载”。该示例保存了包含 HTML 图像代码的 favicon-orbit-base64.txt。其 270,029 字节比 202,491 字节的源文件更大。文章中的对比展示了下载文本的实际开头，仅为提高可读性而进行了缩短。
Base64 通常将三个源字节转换为四个文本字符，在小型包装器之前增加约三分之一的体积。嵌入小图标可以使文档自包含，但将大型图像字符串放入 HTML 或 CSS 中也会增大文档体积，并阻止图像作为单独文件被缓存。
编码不是加密。任何拥有完整 Base64 字符串的人都可以恢复原始图像。如果代码包含私人信息，请像对待源文件一样妥善处理。
本文中截取的片段仅供说明。请使用完整下载的 TXT 或从工具中复制完整代码。
常见问题
编码会降低图片质量吗？
不会。编码保留了原始字节，不会调整大小、压缩或重绘图片。
为什么 Base64 字符串比图片本身大？
Base64 使用四个文本字符来表示三个输入字节，因此在添加包装器或前缀之前，通常会增加约三分之一的大小。
GIF 动画会被保留吗？
编码保留了原始的 GIF 字节，包括动画。预览可能仅显示静态帧，但编码数据保留了所有帧。
Base64 对私密图片安全吗？
Base64 不是加密。如果底层图片是私密的，请妥善保管该字符串。转换器本身在您的浏览器中进行本地处理。
将合适的图像转换为合适的代码。
尝试示例或使用您自己的文件，并在分享前检查结果。
