gmail skype
CSS result

result preview:

What is it?

Shade You Pixels is a tiny tool that converts your images into CSS styles. It was made not for replacing all images on your page, but for superseding small parts of your high detailed elements.

How to use it?

Just drop your small image to a dropbox and copy output CSS snippet in your CSS stylesheets. If you want to convert .png image use default RGBA mode, that will save semi-transparency to output image, if you are converting .gif/.jpg image or don't care about semi-transparency, than change underline switcher to HEX mode, it will save some data size and browser productivity resource. Do not use large images, this will cause browser productivity troubles and increase file size.

Why to use it?

If you use magic Lea Verou's prefix free plugin and your server supports gzip compression, you can supersed your small semi-transparent .png or transparent .gif images ( or any other image type actually) with CSS styles to obtain: