← Back to tools
Image to Base64
Convert images to Base64-encoded strings — everything stays in your browser.
Click or drag an image here
PNG, JPG, GIF, SVG, WEBP
Convert images to Base64-encoded strings — everything stays in your browser.
Click or drag an image here
PNG, JPG, GIF, SVG, WEBP
Embedding images as Base64 data URIs eliminates an HTTP request. Instead of the browser fetching a separate image file, the image data is inlined directly in your HTML or CSS. For small images (icons, logos under ~10KB), this can improve page load performance by reducing round trips to the server.
The trade-off is size: Base64 encoding increases data by roughly 33%, and the string can't be cached separately from the HTML/CSS file. For large images, a regular file reference with proper caching is almost always better. The sweet spot is small UI icons, simple logos, and placeholder images.
Common use cases include embedding images in HTML emails (where external images are often blocked), single-file HTML documents, CSS backgrounds for tiny UI elements, and offline-capable web apps. This tool generates the Base64 string plus ready-to-use HTML <img> and CSS background-image snippets.
This tool in other languages:
Français:
Convertisseur d'image en Base64
Español:
Convertidor de imagen a Base64
Deutsch:
Bild-zu-Base64 Konverter
Português:
Conversor de imagem para Base64
日本語:
画像からBase64への変換
中文:
图片转Base64工具
한국어:
이미지를 Base64로 변환
العربية:
محول الصور إلى Base64
Drag and drop an image or click to upload. The Base64-encoded string is generated instantly along with ready-to-use CSS background-image and HTML <img> snippets. Click Copy to grab whichever you need. Nothing is uploaded to a server.
Use Base64 for very small images (icons, tiny logos under ~5KB) to avoid an extra HTTP request. Use regular files for anything larger — Base64 makes files ~33% bigger and prevents the browser from caching them independently. For most photos and graphics, a linked file plus HTTP/2 is faster.
A data URI embeds the file directly in the document: data:image/png;base64,iVBORw0.... Use it in CSS as background-image: url(data:image/png;base64,...). The tool generates the full URI for you — just copy and paste.
Yes with DeskTools — the conversion happens entirely in your browser using the FileReader API. Nothing is uploaded. You can safely encode screenshots with sensitive data, proprietary logos, or private photos.
Any format the browser can read: PNG, JPG, GIF, WebP, SVG, ICO. The encoded output includes the MIME type, so browsers render it correctly. SVG is a special case — often better to paste the SVG source directly than Base64-encode it.