Image to Base64 & Font to Base64 converter
Our free online tool is here to help you change your image or font into Base64 code.
1. Drag an image/font here or Select file!
Supported input file formats: webp, jpeg, jpg, png, ttf, woff, eot, svg
Our free online tool is here to help you change your image or font into Base64 code.
1. Drag an image/font here or Select file!
Supported input file formats: webp, jpeg, jpg, png, ttf, woff, eot, svg
Base64 is a useful coding language that lets you change any characters into an alphabet made of latin letters, digits, plus signs, and slashes. Other internet users can then take your assortment of characters and turn it back into the original image.
You can turn Chinese characters, emojis, and even pictures into a kind of "readable" string that you can save or send anywhere.
As a clever trick, you can also use Base64 to convert and transfer font files. This protects all the shapes and symbols in your font from getting lost or damaged, which can sometimes happen when you’re transferring fonts in other file formats.
You'll find Base64 all over the internet! It's really useful because it lets you put image files or other binary bits and pieces into text-based stuff like HTML and CSS files. You can even use Base64 when sending email attachments.
When you turn something into Base64, the new string is always bigger than the original (so if you’re looking to make files smaller, Base64 might not be the solution you’re looking for).
Also, Base64 doesn't hide or encrypt any information. This means anyone can decode your Base64 string (if you decide to send it to them), as long as they use the standard set of characters.
Use the Base64 code from our app on websites, or send it to someone else to be decoded.
We designed our website to be a community resource, which is why you can generate Base64 code without having to register.
We don’t collect any of your personal data, ever. Once you leave the website, all of your information leaves with you.
Feel free to encode as many images and fonts as you want.
You can put images encoded with Base64 right into your HTML using the <img> tag. This can speed up the page load time for smaller images, because the browser doesn't have to make extra HTTP requests.
Here's a quick example:Unlike images, fonts are set on the CSS @font-face rule. You might have spotted in our How to Appropriate Custom Fonts from other Websites tutorial that you can use Base64 in @font-face’s src property.
Here's how it works:While using embedded fonts does cut down on the number of HTTP requests, there are a few things to keep in mind:
If you include fonts in your main HTML document, especially if it's created on-the-fly, they might not be cached. The Base64 encoded data is treated as part of the resource it's embedded in, like the HTML or CSS file. So, if the main page cannot be cached, then the fonts won't either. That's why it's best to put embedded fonts in an external CSS file.
Secondly, Base64 encoding normally makes image sizes bigger by about a third, although that can vary.
Finally, be aware that Base64 data can take longer to process than standard, binary data; which isn’t always ideal on mobile devices, and other environments where your cpu memory might be limited.
Share 
Tweet 
