Convert Your Image to Base64

Use this tool to generate the Data URI scheme for your images and directly embedd in the web html page





Try Other Convertor


Your Support Matters!

Instead of directly asking for donations, I'm thrilled to offer you all nine of my books for just $9 on leanpub By grabbing this bundle you not only help cover my coffee, beer, and Amazon bills but also play a crucial role in advancing and refining this project. Your contribution is indispensable, and I'm genuinely grateful for your involvement in this journey!

Any private key value that you enter or we generate is not stored on this site, this tool is provided via an HTTPS URL to ensure that private keys cannot be stolen, for extra security run this software on your network, no cloud dependency



About Data URI

The data URI scheme is a uniform resource identifier (URI) scheme that provides a way to include data in-line in Web pages as if they were external resources. The format of this scheme is

data:[<mediatype>][;base64],<data>

The mediatype is an Internet media type specification (with optional parameters.) The ";base64" means that the data is encoded as base64. Without ";base64", the data is represented using ASCII encoding for octets inside the range of safe URL characters and using the standard %xx hex encoding of URLs for octets outside that range.

If <mediatype> is omitted, it defaults to text/plain;charset=US-ASCII. As a shorthand, "text/plain" can be omitted but the charset parameter supplied.

Examples of data URIs s

data:application/octet-stream;base64,QQo=
data:application/x-gzip;base64,H4sIANG6Ml4AA
data:image/png;base64,iVBORw0K
data:text/plain;base64,SlBFUFZNNzBTUE
data:image/gif;base64,R0lGODlhsARZAv
.....
.....

How to display Base64 images in HTML?

You can embed the image data directly into the document with data URIs. The end result will look like this

<img src="data:image/png;base64, iVBORw0KGgo....." alt="Image Display using this scheme" /

Advantages & DisAdvantages

  • Data URIs consume less bandwidth
  • If you have small static images and use this scheme to increase the page speed
  • Data URIs are not separately cached
  • Special Security consideration needed