FreeImage to Base64
Image to Base64 String
Convert images to base64 data URIs for CSS or HTML.
Drop an image here, or .
Free, no sign-up. Runs in your browser; nothing is uploaded.
Image to Base64: how to use it
- Drop in a small image, such as an icon or logo.
- Choose the Output: a data URI, a CSS background rule, an HTML img tag or the raw base64 text.
- Copy the result into your code.
Tips
- Base64 makes a file about a third larger, so it only makes sense for small images that would otherwise need their own request.
- Optimise the image first with the Image Compressor or SVG Optimizer so the string is as short as possible.
Image to Base64: what it does and when to use it
Base64 encoding turns the bytes of an image into plain text, so the image can live inside an HTML file, a CSS stylesheet, a JSON payload or an email template instead of being a separate file. The output here can be a complete data URI, a ready CSS background rule, an HTML img tag, or just the raw base64 text.
It is the right tool for small things: an icon, a tiny logo, a loading spinner, or an image that must travel inside a single self-contained HTML file. Embedding saves one network request, which can matter for a handful of tiny images on a page.
Base64 makes the data about a third larger than the original file, and an embedded image cannot be cached separately by the browser, so large photos should stay as normal files. Compress or resize the image first with the Image Compressor to keep the string short. To go the other way, use Base64 to Image.
Image to Base64: frequently asked questions
Is the Image to Base64 free, and do I need to sign up?
Yes, the Image to Base64 is 100% free with no sign-up, no login and no account. The Image to Base64 runs in your browser, so it has no daily limit and no upload, and saves at full size with no watermark. See why it is free.
How do I convert an image to Base64?
Drop the image and copy the result as a data URI, an HTML img tag or a CSS background rule. Use it for small icons only: Base64 makes a file about a third larger than the original.
When should I use Base64 images?
For tiny images such as icons in an email template or a single-file HTML page, where an extra file would be awkward. For normal photos on a website, a separate compressed WebP loads faster and can be cached.