Home

Awesome

Pokémon Cards Holographic effect in CSS

This is a repository holder for the Pokemon Cards CSS Holographic effect.

🔥 As seen on css-tricks.com and codepen
🌟 Demo running @ https://poke-holo.simey.me/

A collection of advanced CSS styles, applied with SvelteJS.

Uses CSS Transforms, Gradients, Blend-modes and Filters to simulate the various Holofoil effects found in the Sword and Shield era of Pokemon Trading Cards.

<img src="public/pokemon-cards-demo.gif" />

support / tip

If you think this is super cool, or useful, and want to donate a little, then you are also super cool!

<img src="https://user-images.githubusercontent.com/2817396/149629283-6002944f-9253-4e35-917d-89b476deae4e.png" width=20>£1 One Pound tip£1 tip
<img src="https://user-images.githubusercontent.com/2817396/149629283-6002944f-9253-4e35-917d-89b476deae4e.png" width=20>£5 Five Pounds tip£5 tip
<img src="https://user-images.githubusercontent.com/2817396/149629283-6002944f-9253-4e35-917d-89b476deae4e.png" width=20>£10 Ten Pounds tip£10 tip

attribution

<sub>- Galaxy Holo from aschefield101</sub>
<sub>- Some backgrounds from Vecteezy</sub>