How to use the Image to Base64 tool
- Drop an image onto the box or click to choose a file.
- Pick the output you need: data URI, raw Base64, CSS or HTML.
- Copy it straight into your code.
When to inline images as Base64
Embedding an image as a data URI puts the image inside your HTML, CSS or JSON instead of in a separate file. That saves a network request, which can help for tiny images such as icons, loading spinners and small logos, or when you need a single self-contained file like an HTML email or a report.
It’s a poor fit for larger images. Base64 makes data about 33% bigger, the image can’t be cached separately from the page, and it delays the page’s first render. A good rule is to inline only images under about 10 KB.
Which output to copy
- Data URI: paste into an
srcorurl(). - Base64 only: for APIs and JSON fields that expect the raw string.
- CSS background: a ready-made
background-imagerule. - HTML <img>: includes the width and height to prevent layout shifts.
To shrink the image before encoding it, run it through Compress Image first. To turn a Base64 string back into a file, use Base64 to Image.
Frequently asked questions
When should I inline an image as Base64?
For small icons and images under about 10 KB, inlining saves an HTTP request. Larger images are better served as normal files, because Base64 makes them about 33% bigger and they can’t be cached separately.
Can I convert files that aren’t images?
Yes. Any file works and you get its data URI and raw Base64. The CSS and HTML snippets are only useful for images.
Are my files uploaded to a server?
No. HushConverts converts everything with code that runs in your browser, so your text and files stay on your device. You can even use most tools offline once the page has loaded.
Related guides
More encoding & developer
- Base64 EncodeTEXT → BASE64Turn any text into Base64.
- Base64 DecodeBASE64 → TEXTPaste a Base64 string to turn it back into normal text.
- Base64 to ImageBASE64 → IMAGEPaste a Base64 string or a full data:image URI to preview the image and download it as a file.
- URL Encode / DecodeTEXT → URLMake text safe to put in a URL, or turn a percent-encoded string like %E2%9C%93 back into readable text.
- HTML Entity Encode / DecodeTEXT → HTMLEscape text so it displays literally in HTML, or decode entities such as &, < and © back into the characters they stand for.
- JSON Formatter & ValidatorJSON → JSONPaste JSON to pretty-print it, minify it, or find out exactly where it’s broken.
- JSON to CSVJSON → CSVTurn a JSON array of objects into a spreadsheet-ready CSV.
- CSV to JSONCSV → JSONPaste CSV from a spreadsheet or export to get clean JSON.