Implementing a Foil Sticker Effect

163 ibobev 11 9/1/2025, 6:47:21 PM 4rknova.com ↗

Comments (11)

andrewljohnson · 3h ago
This is neat, I have a simple CSS effect that I apply to foil cards on my Magic card marketplace site, but I have wondered what it would take to replicate all the different foil effects that a Magic card can come in to be both more varied and more true to life, in a performant way that fits into my CRUD svelte UX.
dalmo3 · 3h ago
crazygringo · 45m ago
Link to see it in action: https://poke-holo.simey.me/

Be sure to scroll down to see the advanced foil effects on cards, the top card is a very basic example.

darepublic · 9m ago
so a more generic version of the pokemon card demo. awesome!
unglaublich · 4h ago
Shaders are really fascinating imo. Shadertoy is a nice website to try some out online https://www.shadertoy.com/
dmd · 3h ago
ios has a sticker-effect (“shiny”) like this which has the added bonus of responding directly to phone tilt. the first time i saw it I actually gasped.
xnx · 4h ago
Cooler than I expected! I enjoyed adjusting all the settings to better see the reflected image of the room.
GuB-42 · 3h ago
I did that too, looked up the reflection map.

As it turns out, the room in question is in Jedlinka Palace in Poland. The texture itself is this one: https://polyhaven.com/a/mirrored_hall

mensetmanusman · 3h ago
Hopefully the api has access to the webcam!
pmkary · 1h ago
I wished for years I could know how to make this! I can't express my thank you enough!
VenturingVole · 4h ago
This is the kind of random things I absolutely love to see here.