Image to Base64 Converter
Image ToolsEncode any image as a Base64 string, data URI, CSS rule or HTML tag.
Runs entirely in your browser — nothing is uploaded
Features
- Drag, browse or paste a screenshot straight onto the page.
- PNG, JPG, GIF, WebP and SVG, encoded from the real bytes.
- Base64, data URI, CSS background, HTML tag or Markdown output.
- Shows the file name, format, dimensions and the size Base64 adds.
- Optional 76-character line wrapping for email and PEM-style blocks.
- Runs in your browser — the file is never uploaded.
How to use the Image to Base64 Converter
- 1Drop an image on the box, browse for one, or paste a screenshot.
- 2Pick the output you need — Base64, data URI, CSS, HTML or Markdown.
- 3Copy the string, or download it as a .txt file.
Frequently asked questions
What is the difference between the Base64 and data URI options?
The data URI is the Base64 with a "data:image/png;base64," prefix, which is what an img src or a CSS url() needs to recognise it as an image. Plain Base64 is the payload on its own, which is what an API field or a JSON body usually wants.
Why is the Base64 bigger than my image file?
Base64 carries three bytes in every four characters, so it is always about 33% larger — that is inherent to the encoding, not something a tool can avoid.
Should I inline images as Base64 in my CSS?
For small icons and logos, yes — it saves a request. For anything substantial, no: the data cannot be cached separately from the file that holds it, it costs a third more bytes, and a stylesheet carrying it blocks rendering until the whole thing has downloaded. The tool warns once a file is large enough for this to matter.
Can I convert an SVG?
Yes. SVG is text rather than binary, so it encodes like any other file — and it is one of the few cases where inlining is usually worth it, because the strings are small. For CSS specifically, a percent-encoded SVG is smaller still than Base64.
Can I paste a screenshot instead of uploading a file?
Yes — take the screenshot and press Ctrl+V (Cmd+V on a Mac) anywhere on the page. There is no file on disk to drop in that case, which is exactly why it is supported.
Is my image uploaded to a server?
No. It is read and encoded in your browser, so an unreleased asset or a private screenshot never leaves your machine.