CSS Masks

03 Apr 2013

Quite a while ago, I read an article on CSS Masks. I bookmarked it back then, and rediscovered it recently. I got excited by the article and came up with some small cases of my own.
css-masks
Unfortunately the current implementation of CSS Masks is only included within webkit, as can be seen on caniuse.com. Checkout a couple of examples (on a webkit browser, including iphone!) using the link below.

View demo

Instead of explaining it all myself, I'll simply share the page where I learned how to use them. It explains a couple of different techniques covering: SVG, Gradients and Cross-browser masks. The demo page I've created uses the relatively simple CSS implementation with a webkit prefix.