🖼️

图片转Base64

免费在线图片转Base64工具。将任何图片转换为Base64编码字符串。便于嵌入HTML/CSS,无需外部图片文件。

广告
📁

拖放图片到此处

或点击浏览文件

PNG, JPG, GIF, SVG, WebP

文件大小

尺寸

类型

Base64

输出格式:

已复制

复制失败。请选择结果并手动复制。

嵌入此工具

请使用 1 至 4096 的整数像素尺寸。

× px (1–4096)

                        

💡 集成提示

复制嵌入代码并粘贴到您网站的HTML中。响应式版本会自动适应所有屏幕尺寸。

4.2
6 个评分
✓

热门工具

没有更多工具
探索所有工具

先根据数据识别格式,再由浏览器解码。编码读取原始字节,不通过 Canvas 重新编码。Base64 更大,适合小图标或 JSON/HTML/CSS 嵌入。

这些图像控件通过浏览器 API 处理所选文件。网站广告及其他服务有各自的行为。原生解码和编码支持因浏览器而异。Canvas 导出一张渲染图像;不承诺保留动画、色彩配置、元数据,也不承诺保留或删除 EXIF。尺寸采用解码后的图像,包括解码器应用的方向。请保留原文件。

关于图片转Base64

将图片转换为Base64编码字符串。非常适合在HTML或CSS中嵌入图片,无需单独的图片文件。

将原始图像字节编码为数据 URI、原始 Base64、HTML 或 CSS,或解码 Base64 图像以预览和下载。 这些图像控件通过浏览器 API 处理所选文件。网站广告及其他服务有各自的行为。原生解码和编码支持因浏览器而异。Canvas 导出一张渲染图像;不承诺保留动画、色彩配置、元数据,也不承诺保留或删除 EXIF。尺寸采用解码后的图像,包括解码器应用的方向。请保留原文件。

PNG 的原始 Base64 没有 URI 前缀;HTML 会转义用作替代文本的文件名。

此流程每个文件最多 100 MiB、1 亿像素、每边 32767 像素。浏览器限制可能更低。

使用场景

在HTML中嵌入小图标,无需HTTP请求
在CSS中直接使用图片作为背景
在JSON API中传输图片数据
创建自包含的HTML文档
在电子邮件模板中嵌入图片

如何使用

1

上传或拖放图片文件

2

等待图片处理完成

3

复制生成的Base64字符串

4

在HTML img标签或CSS中使用

5

选择编码,然后选择或拖入图像。

6

检查类型、尺寸和原始文件大小。

7

选择数据 URI、原始 Base64、HTML 或 CSS。

8

复制结果;若失败,请手动复制。

9

选择解码,粘贴 Base64 或格式一致的数据 URI,等待预览后下载。

10

再次尝试前重置所选文件。

专业提示

  • Base64会使图片大小增加约33%
  • 适合小图标和小图片
  • 大图片仍应使用外部文件
  • 请保留原图,在预览中检查边缘和透明度,使用前比较字节大小。

常见问题解答

Base64允许将图片嵌入HTML/CSS中,减少HTTP请求,适合小图标。但会增加文件大小,不适合大图片。

支持JPG、PNG、GIF、SVG和WebP等常见格式。每种格式都会保留其MIME类型。

使用data URI:<img src="data:image/png;base64,..." />。CSS中类似:background-image: url(data:image/png;base64,...)。

可以。根据字节识别 JPEG,下载扩展名为 .jpg;将 JPEG 字节声明为 PNG 会被拒绝。

PNG、JPEG、WebP、GIF、BMP、SVG 及其他可识别数据仍需要浏览器解码支持。损坏或不支持的数据会显示错误。

大图会增加文本和页面大小。数据 URI 可避免单独的图像请求,但是否支持取决于接收应用。

FreeWebTools AI