Here is continuation of this question, this time lets compress/generate Mario in colors!
Image size is 64x64 (above one is zoomed). The required output is valid <img ...> tag with exact same image in dataURI form, working on chrome, firefox and safari (and IE4 - joke ;). In snippet below you can find example tag in required form and all needed data.
bmpHeader="424d760a00000000000078000000280000004000000040000000010004000000000000000000c40e0000c40e00000000000000000000000000002b81fc00081fcd00085a7200fcfafc005e5e5e001139b90008930b00ababab0000ff000000ff000000fffc00fcffab00abff000000ff000000ff00000000";
bmpPixels="5525552555255525552555255525552555255525552555555055555550555555552555255525552555255525552555255525552555255588504888885048888855055505550555055505550555055505550555055505558850488888504888884404440444044404440444044404440444044404440444885048888850488888440444044404440444044404440444044404440444044488504888885048888844044404440444044404440444044404440444044404448850488888504888884404440111111144440444044404440444044404440444445044444450444444011114441444114400000000000000880000000000000000000000000000000000441441144111100000000000000040800000000000005555555055555550550444441111771100000000000000000480000000000000488888504888885048044444447777770000000000000000000880000000000048888850488888504800777744447777700000000000000000048000000000004888885048888850480077777774477777000000000000000000088000000000488888504888885048007177177744777770000000000000000004080000000048888850488888504800117447777477777011140000000000000048000000004444445044444450440444777777744777711111040000000000000088000000000000000000000000004477117774477771111100100000000000004080000055505555555055555500077714477447741111110410000000000000048000008850488888504888880417774447774770011110011000000000000000088000885048888850488888004777777777471140111041100000000000000004800088504888885048888800011777777744111040011100000000000000000008808850488888504888880001447771177441117700000000000000000000000408885048888850488888000444777144774444447700110000000000000000004844504444445044444400007777744477777744477111400000000000000000000000000650000000000000477777777777774447711000000000000000000000000000055000000000000047117777777774447711400000000000000000000000000006500000000000000014477114774447771170004000000000000000000000000550000000000000004447114447447777147747440400000000000000000000065000000000000000000071447744777717771111040000000000000000100005500001000000000000000047774477771741177111400000000000000051100650001010000000000000000000007777111777411110000000000000015111165111101000000000000000000000777771777444111000000000000015111116511111010000000000000000000077777777447710100000000000001511111651111101000000000000000000000777777744700100000000000000151111165111110100000000000000000000071177774400000000000000000015111116511111010000000000000000000001144777000000000000000000001511111651111101000000000000000000000144477000000000000000000000015111155111101000000000000000000000444000000000000000000000000001511006500110100000000000000000000000000000000000000000000000000010000000000100000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000003002222000000000000000000000000000000000000000000000000000000000333222222200000000000000000000000000000000000000000000000000000003332222222220000000000000000000000000000000000000000000000000001032222222222330000000000000000000000000000000000000000000000001110223221221233000000000000000000000000000000000000000000000000113333332222200300000000000000000000000000000000000000000000000003333333233320030000000000000000000000000000000000000000000000000033333233323000000000000000000000000000000000000000000000000000000000111111130000000000000000000000000000000000000000000000000000003311113333300000000000000000000000000000000000000000000000000000313311131113000000000000000000000000000000000000000000000000000031311131133300000000000000000000000000000000000000000000000000000333113103330000000000000000000000000000000000000000000000000000022222222211000000000000000000000000000000000000000000000000000000222220011100000000000000000000000000000000000000000000000000000000000001110000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000" //pixels
dataURI='data:image/bmp,%'+(bmpHeader+bmpPixels).match(/../g).join('%');
msg.innerText=`<img alt src=${dataURI}>`
pic.src = dataURIpre {white-space: pre-line;word-break: break-all}<img id="pic">
<pre id="msg"></pre>You can use any dataURI image format supported by chrome, firefox and safari (e.g bmp, png, gif etc...). However my proposition is to use dataURI BMP format without base64 which is very simple and which is presented in snippet above - we have there bmpPixels string - each character in that string represents one pixel (colors from 0 to f) starting from left bottom pixel, line by line. In dataURI we join bmpHeader and bmpPixels and put char % between each two characters (hex num) - and thats all. In snippet below I also include bmp+base64 valid example (img tag to be valid need to have 'alt' attribute)
<img alt src=data:image/bmp;base64,Qk12CgAAAAAAAHgAAAAoAAAAQAAAAEAAAAABAAQAAAAAAAAAAADEDgAAxA4AAAAAAAAAAAAAAAAAACuB/AAIH80ACFpyAPz6/ABeXl4AETm5AAiTCwCrq6sAAP8AAAD/AAAA//wA/P+rAKv/AAAA/wAAAP8AAAAAVSVVJVUlVSVVJVUlVSVVJVUlVSVVJVVVUFVVVVBVVVVVJVUlVSVVJVUlVSVVJVUlVSVVJVUlVYhQSIiIUEiIiFUFVQVVBVUFVQVVBVUFVQVVBVUFVQVViFBIiIhQSIiIRAREBEQERAREBEQERAREBEQERAREBESIUEiIiFBIiIhEBEQERAREBEQERAREBEQERAREBEQERIhQSIiIUEiIiEQERAREBEQERAREBEQERAREBEQERAREiFBIiIhQSIiIRAREAREREUREBEQERAREBEQERAREBEREUERERFBEREQBERREFEQRRAAAAAAAAACIAAAAAAAAAAAAAAAAAAAAAABEFEEUQREQAAAAAAAAAECAAAAAAAAAVVVVUFVVVVBVBEREERF3EQAAAAAAAAAABIAAAAAAAABIiIhQSIiIUEgEREREd3d3AAAAAAAAAAAACIAAAAAAAEiIiFBIiIhQSAB3d0REd3dwAAAAAAAAAAAEgAAAAAAASIiIUEiIiFBIAHd3d3RHd3cAAAAAAAAAAAAIgAAAAABIiIhQSIiIUEgAcXcXd0R3d3AAAAAAAAAAAAQIAAAAAEiIiFBIiIhQSAARdEd3dHd3cBEUAAAAAAAAAEgAAAAAREREUERERFBEBER3d3d0R3dxEREEAAAAAAAAAIgAAAAAAAAAAAAAAAAARHcRd3RHd3EREQAQAAAAAAAAQIAAAFVQVVVVUFVVVQAHdxRHdEd0ERERBBAAAAAAAAAEgAAAiFBIiIhQSIiIBBd3REd3R3ABERABEAAAAAAAAAAIgACIUEiIiFBIiIgAR3d3d3dHEUAREEEQAAAAAAAAAASAAIhQSIiIUEiIiAABF3d3d0QREEABEQAAAAAAAAAAAAiAiFBIiIhQSIiIAAFEd3EXdEERdwAAAAAAAAAAAAAABAiIUEiIiFBIiIgABER3cUR3REREdwARAAAAAAAAAAAASERQREREUERERAAAd3d0RHd3d0RHcRFAAAAAAAAAAAAAAAAABlAAAAAAAABHd3d3d3d3REdxEAAAAAAAAAAAAAAAAAAFUAAAAAAAAEcRd3d3d3REdxFAAAAAAAAAAAAAAAAAAAZQAAAAAAAAABRHcRR3REd3EXAAQAAAAAAAAAAAAAAABVAAAAAAAAAAREcRREdEd3cUd0dEBAAAAAAAAAAAAAAGUAAAAAAAAAAAAHFEd0R3dxd3EREEAAAAAAAAAAAQAAVQAAEAAAAAAAAAAEd3RHd3F0EXcRFAAAAAAAAAAFEQBlAAEBAAAAAAAAAAAAAAd3cRF3dBERAAAAAAAAABUREWUREQEAAAAAAAAAAAAAB3d3F3dEQREAAAAAAAABURERZREREBAAAAAAAAAAAAAHd3d3dEdxAQAAAAAAAAFRERFlEREQEAAAAAAAAAAAAAB3d3d0RwAQAAAAAAAAAVEREWURERAQAAAAAAAAAAAAAHEXd3RAAAAAAAAAAAABURERZREREBAAAAAAAAAAAAAAEUR3cAAAAAAAAAAAAAFRERFlEREQEAAAAAAAAAAAAAAURHcAAAAAAAAAAAAAABUREVUREQEAAAAAAAAAAAAABEQAAAAAAAAAAAAAAAAAFREAZQARAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABAAAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAMAIiIAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAzMiIiIgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAMzIiIiIiAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAEDIiIiIiIzAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAERAiMiEiEjMAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAARMzMzIiIgAwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAMzMzMjMyADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAADMzMjMyMAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAARERETAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAMxERMzMwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAxMxETERMAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAADExETETMwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAzMRMQMzAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACIiIiIhEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAiIiABEQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAERAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA==>You can presents you results in answer using codegolf snippets and include this CSS rule: img {image-rendering: pixelated;width:256px;height:256px} to zoom image.
UPDATE
I see that unconsciously I made 2 separate competitions in this question: first for programs (codes written in some programming language which produce result img tag), and second for img tags which contains results from compression tools. Both are interesting but main competition is for programs. Although I hope that someone shows that hand written program can achieve better results than 'compressed img tags' - but may be it is impossible?
