Clipping & Masking
What is it?
Clipping takes a region of an element and prevents rendering - the element gets “clipped.” Masking is using an image as coverage over an element, affecting the alpha channel of the element. Portions of a masked element are fully or partially transparent, and so the effect really comes from a combination of an element and the masking image.
The Adobe Web Platform team is contributing to the CSS Masking Module Level 1 specification, which aims to bring these two operations to the HTML world.
When can I use it?
Now in Chrome, Firefox and Safari. For a view of current and upcoming browser support, check out caniuse.com.
Where can I learn more?
Also of interest: