Gaw particularly liked how the silhouettes of people were used to mask other film shots in the True Detective titles, so he set about recreating this effect. You can read his full account of how he did it here.
CSS masking is a technique that uses one graphical element as a luminance or alpha mask for another graphical element, enabling you to control the transparency of the element being masked. This can be combined with clipping, which defines the visible portion of an element, to create some interesting visual effects.
CSS masking is not widely supported, so this demo only works in Chrome and Mobile Safari. The creator warns that it is "most definitely experimental", and predicts misbehavior such as crashing and animations failing to start.
Get the Creative Bloq Newsletter
Daily design news, reviews, how-tos and more, as picked by the editors.
Thank you for reading 5 articles this month* Join now for unlimited access
Tanya is a writer covering art, design, and visual effects. She has 16 years of experience as a magazine journalist and has written for numerous publications including 3D World, 3D Artist, ImagineFX, Computer Arts, net magazine, and Creative Bloq. For Creative Bloq, she mostly writes about web design, including the hottest new tools, as well as 3D artwork and VFX.
