drag & drop · runs in your browser
Image to Base64 Converter
Convert an image to a Base64 Data URL for CSS, HTML or Markdown, or decode Base64 back to an image.
Drop an image here, or click to browse
PNG, JPG, GIF, WebP, SVG, AVIF, ICO, anything your browser can render.
Where to use it
- Inline an icon in CSS without a separate request (great for small SVG / PNG sprites).
- Embed an image directly into HTML email or a single-page artefact.
- Stash a screenshot in Markdown notes, keeps the asset and the doc together.
- Send a one-off image inside a JSON payload (avoid for > 100 KB, Base64 adds 33% overhead).
About this tool
Encode an image to a Base64 data URI, or decode a data URI back to an image, right in the browser. Inline a small icon directly in CSS or HTML to save a request, or inspect and extract an embedded image from existing markup.
Files are read locally and never uploaded. Drop in a PNG, JPG, SVG or GIF and copy the data URI, or paste a data URI to preview and download the decoded image.
Frequently asked questions
When should I inline an image as Base64?+
For tiny, frequently used assets like icons or 1px backgrounds, inlining avoids an extra HTTP request. For larger images it is counterproductive — Base64 adds about 33% size and is not cached separately.
Does Base64 make images bigger?+
Yes, roughly 33% larger than the binary file because of the encoding. That overhead is fine for very small assets but adds up quickly for photos.
Is the file uploaded to convert it?+
No. The browser reads the file locally with the File API and encodes it on your device, so nothing is sent to a server.