Générateur de cartes Pokémon interactif en JavaScript

Dans ce guide, découvrez comment intégrer et présenter sur votre site web un générateur de cartes Pokémon entièrement front-end, sans appel PHP.

Vos visiteurs pourront choisir leur Pokémon, personnaliser le fond, voir la carte se retourner avec une belle animation et télécharger le résultat en HD.

Fonctionnalités clés

✱ Chargement dynamique des données Les listes de Pokémon et de fonds proviennent directement de fichiers JSON/TXT hébergés sur GitHub.

✱ Animation de flip Cliquez sur la carte pour la faire basculer recto/verso grâce à une interpolation « easeInOutCubic ».

✱ Effet de paillettes (sparkles) Activez ou désactivez un effet visuel festif via une simple checkbox.

✱ Personnalisation du filigrane Saisissez jusqu’à 8 caractères pour le texte tourné affiché au verso.

✱ Export

- PNG écran : téléchargement direct de la carte au format PNG.

- PNG HD : export jusqu’à 300 DPI en recalculant un canvas off-screen.

Partage et licence

✱ Le code est 100 % JavaScript, sans dépendances serveur.

✱ Libre de réutilisation et de modification. Mentionnez simplement la source si vous le diffusez publiquement.

Téléchargement

✱ GitHub : Open-Source

✱ CodePen : Open-Source

✱ CodePen : Démo en ligne