Embedding Base64 Images

Purely out of curiosity, which browsers does Base64 image embedding work in? What I'm referring to is https://greywyvern.com/code/php/binary2base64">this</a>;.

I realize it's not usually a good solution for most things, as it increases the page size quite a bit - I'm just curious.

Some examples:

HTML:

<img alt="Embedded Image" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIA..." />

CSS:

div.image {
  width:100px;
  height:100px;
  background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIA...);
}

Update: 2017-01-10

Data URIs are now supported by all major browsers. IE supports embedding images since version 8 as well.

http://caniuse.com/#feat=datauri

---

Data URIs are now supported by the following web browsers:

> * Gecko-based, such as Firefox, SeaMonkey, XeroBank, Camino, Fennec and K-Meleon > * Konqueror, via KDE's KIO slaves input/output system > * Opera (including devices such as the Nintendo DSi or Wii) > * WebKit-based, such as Safari (including on iOS), Android's browser, Epiphany and Midori (WebKit is a derivative of Konqueror's KHTML engine, but Mac OS X does not share the KIO architecture so the implementations are different), as well as Webkit/Chromium-based, such as Chrome > * Trident > * Internet Explorer 8: Microsoft has limited its support to certain "non-navigable" content for security reasons, including concerns that JavaScript embedded in a data URI may not be interpretable by script filters such as those used by web-based email clients. Data URIs must be smaller than 32 KiB in Version 8[3]. > * Data URIs are supported only for the following elements and/or attributes[4]: > * object (images only) > * img > * input type=image > * link > * CSS declarations that accept a URL, such as background-image, background, list-style-type, list-style and similar. > * Internet Explorer 9: Internet Explorer 9 does not have 32KiB limitation and allowed in broader elements. > * TheWorld Browser: An IE shell browser which has a built-in support for Data URI scheme

http://en.wikipedia.org/wiki/Data_URI_scheme#Web_browser_support">http://en.wikipedia.org/wiki/Data_URI_scheme#Web_browser_support</a>

Most modern desktop browsers such as Chrome, Mozilla and Internet Explorer support images encoded as data URL. But there are problems displaying data URLs in some mobile browsers: Android Stock Browser and Dolphin Browser won't display embedded JPEGs.

I reccomend you to use the following tools for online base64 encoding/decoding:

• Encode to Base64 format

• Decode from Base64 format

Check the "Format as Data URL" option to format as a Data URL.

Can I use (http://caniuse.com/#feat=datauri) shows support across the major browsers with few issues on IE.