simeydotme
pokemon-cards-css
CSS

A collection of advanced CSS styles to create realistic-looking effects for the faces of Pokemon cards.

Last updated Jul 9, 2026
7.8k
Stars
759
Forks
3
Issues
+13
Stars/day
Attention Score
90
Language breakdown
No language data available.
β–Έ Files click to expand
README

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/ | | | 151 version @ https://poke-151.simey.me/ ⭐ |




[!TIP]
I've published a component which can help with getting you a similar effect to this, without much effort;
https://github.com/simeydotme/hover-tilt

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.


[!NOTE]
Please read #issues/19 before asking / requesting any help or advice on the Project.
Thank you.

support / tip

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

| | | | |--|--:|---------| | | Β£1 One Pound tip | Β£1 tip | | | Β£5 Five Pounds tip | Β£5 tip | | | Β£10 Ten Pounds tip | Β£10 tip |


attribution

- Galaxy Holo from aschefield101 - Some backgrounds from Vecteezy

Β© 2026 GitRepoTrend Β· simeydotme/pokemon-cards-css Β· Updated daily from GitHub