Holographic Cards: A CSS Deep Dive

Simon Goellner’s holographic trading card collection is turning heads. The effect layer stacks a series of filter(), background-blend-mode(), mix-blend-mode(), and clip-path() functions—each meticulously tuned to produce the shimmering result.

Curious how it works? A quick DevTools hack—setting img { visibility: hidden; }—can isolate each blend layer. Josh Dance responded with an interactive breakdown, giving you manual sliders to tweak the inputs. Try the live demo at poke-holo.simey.me.