图片转 Base64Image to Base64
拖入 / 粘贴图片一键转 Base64 与 Data URI，输出 Data URI / 纯 Base64 / CSS / HTML 四种格式。纯客户端运行，图片不上传任何服务器。
工具介绍
3 段详细说明图片转 Base64把 JPG / PNG / WebP / GIF / SVG 等图片一键编码为 Base64 字符串与 Data URI，直接内嵌进 HTML、CSS、JSON、Markdown。拖入图片或 Ctrl/Cmd+V 粘贴截图即可自动转换，无需任何操作。
所有编码都在浏览器内存中完成，图片不上传任何服务器。基于浏览器原生 FileReader 与 Data URL 协议，零依赖、零打包，10 MB 以内瞬时完成。
输出支持 Data URI / 纯 Base64 / CSS / HTML 四种格式一键切换：内联小图标减少 HTTP 请求、邮件模板防图裂、单文件演示页打包分发，复制或下载 .txt 一键带走。
基础知识 · Data URI 语法
RFC 2397 · Base64Data URI 是「把数据直接写进引用处」的协议：Base64 编码后的图片不需要任何外部文件，字符串本身就是资源。理解以下 6 个要点即可正确使用：
data uriData URI 语法data:[<mediatype>][;base64],<data> 是 RFC 2397 定义的「数据即文件」协议。例如 data:image/png;base64,iVBOR…，浏览器解析后等同引用一张真实图片，无需网络请求。3→4 chars编码原理与体积size budget适用体积建议svg noteSVG 特殊性data:image/svg+xml;utf8,<svg …> 明文内联（体积更小，但 #、" 等字符需 URL 转义）。本工具统一输出 Base64 变种，兼容性最好。no cache缓存与更新security安全边界<a href> 导航与顶层窗口打开场景被现代浏览器禁止（防钓鱼）；<img src>、background-image、fetch 内嵌不受影响。邮箱客户端对 Data URI 支持不一，发送前请先测试。HTML —— 直接粘进标签：<img src="data:image/png;base64,…">。CSS —— 直接粘进样式：.icon { background-image: url("data:…"); }。JSON / API —— 取「纯 Base64」格式作为字段值，接收方自行拼 Data URI 或解码为二进制。Markdown —— 多数渲染器支持内联图片语法：，适合单文件文档分发。使用说明
4 步快速入门使用场景
5 个真实案例把 logo、箭头、loading 等小图标转 Data URI 内进 CSS，省掉多次 HTTP 请求，首屏更稳。
EDM 营销邮件把关键图片内联，避免邮件客户端拦截外链图导致的图裂空白。
把截图、图表编进 HTML/Markdown，产出一个无需依赖资源目录的单文件，随聊天工具直接分发。
JSON/XML 接口以 Base64 字段承载小图（验证码、头像、签名图），前端解码即显。
为懒加载图片生成 1px 或模糊缩略图的 Data URI 占位，体验更平滑。
常见问题
10 个问答图片转 Base64 是什么？有什么用？
把图片的二进制数据编码为 Base64 文本字符串。以 Data URI 形式直接嵌入 HTML / CSS / JSON 后，浏览器无需额外请求即可显示图片，常用于小图标内联、邮件模板和单文件分发。
我的图片会上传到服务器吗？
不会。编码通过浏览器原生 FileReader 在本机内存完成，图片不经过任何网络。可断网使用，关闭网络后再打开仍能正常转换。
支持哪些图片格式？
浏览器能显示的格式都支持：JPG / PNG / WebP / GIF（含动图，编码首帧所在的整个文件）/ SVG / ICO / AVIF / BMP 等。转换不改变图片内容，只是重新编码。
转换后体积会变大吗？
会。Base64 编码后约为原文件的 4/3（+33%），这是编码原理决定的，不是工具问题。因此推荐只内联 10 KB 以内的小图，大图仍走文件或 CDN 引用。
为什么粘贴截图没有反应？
请确认剪贴板里是图片本体（截图工具的「复制图像」），而不是文件路径或图片查看器里的文字。也可以把截图先保存为文件再拖入上传区。
GIF 动图转出来的还能动吗？
能。工具编码的是整个 GIF 文件（含全部帧与帧率信息），Data URI 内嵌到 <img> 后动画照常播放；用作 CSS background-image 时动画同样有效。
Data URI 与纯 Base64 有什么区别？
Data URI = data:前缀（声明 MIME 类型与编码方式）+ Base64 数据，浏览器可直接当资源引用；纯 Base64 只有数据本体，适合放进 JSON 字段或自行拼前缀。两种格式本工具一键切换。
有多大的图片限制？
建议 ≤ 10 MB（工具会拦截并提示）。超限不是编码能力问题，而是浏览器字符串长度与页面内存的实用边界——大图请先用「图片压缩」瘦身，或改走文件引用。
移动端能用吗？
支持。上传区自适应布局，手机相册选图、文件管理器拖选均可；iOS / Android 系统分享面板「复制图像」后同样支持粘贴转换。
结果可以下载吗？
可以。点「下载 .txt」把当前格式的结果保存为文本文件；也可以直接复制粘贴。下载文件命名规则为 原文件名.base64.txt。
相关工具
图像分类数据来源
隐私优先FileReader.readAsDataURL 与 Image 对象，无任何第三方依赖。编码结果与 atob / OpenSSL / Java Base64 等标准实现完全一致，无 WASM、无 polyfill。