Pokemon Card
A Pokémon-inspired card that adapts its surface to the Pokémon's type (and optional secondary type), with support for sizes and an animated Mega variant.
025
electric
Pikachu
Installation
Usage
The card surface reads its color from the type-colors theme token (pokemon-type-colors). Pass a secondary type to get a dual-type gradient surface blending both colors. The mega variant adds an animated shimmer overlay for Mega-evolved Pokémon.
Examples
Dual type
Pass the secondary prop to render a gradient surface that blends the primary and secondary type colors.
130
waterflying
Gyarados
API Reference
PokemonCard
Main card container. Also accepts all native <div> props.
| Prop | Type | Default |
|---|---|---|
type | "normal" | |
secondary | — | |
size | "default" | |
isMega | boolean | false |
PokemonCardHeader
Card header slot. Accepts all native <div> props.
PokemonCardTitle
Card title slot. Accepts all native <div> props.