Em Calculator

Em Calculator

Archive for

September 2009

Sep 15 / 5:10pm

Rainbow colors

Slick design shouldn’t compromise HTTP requests or size of DOM tree. That’s why the new version is going to use as little images as possible – you can see how each new color pane was made – just by changing some RGB values in CSS.

Background mask

This effect was created by using one large PNG mask and a few smaller semitransparent black sprites (triangles, X circles). There is no need to make new images for each color, as semitransparency takes care of everything – starting from darker border to hover effects.