GratuitVidéo
Fenêtre d'application et zoom
- 365365 téléchargements
- 125125 mentions J'aime
- 188188 sauvegardes
Compatible avec
+ HyperFrames- Claude Code
- Codex
- Cursor
- et 3 autres
Présentations HTML animées v1.0.0
Utilisez cette ressource pour créer une présentation animée en HTML ou convertir un PowerPoint en page web
Nouveau
- 415 téléchargements
- 105 mentions J'aime
- 136 sauvegardes
Gratuit
Installer avec la CLI
Dans un terminal, depuis le dossier voulu :
npx --yes palatekit@latest install animated-html-slidesSans option, la skill va dans ~/.agents/skills/ ; ajoutez --agent claude-code (ou codex, cursor…) pour viser un agent.
Première fois : connectez la CLI avec
npx --yes palatekit@latest loginL'agent vous pose quelques questions (objectif, longueur, contenu, densité), génère trois aperçus de style puis construit la présentation complète dans un fichier HTML unique, sans dépendance. Les diapositives gardent un format 16:9 fixe sur tous les écrans. Vous obtenez un fichier que vous pouvez ouvrir, éditer dans le navigateur, exporter en PDF ou déployer sur Vercel.
Choisie surtout par
Mise à jour le 2 novembre 2026
Aperçus
Caractéristiques
- Fonctionne dans
- Guides d'installation
- Génère avec
- Le modèle de votre agent
- Utilise
- Un navigateur web
- Node.js (déploiement Vercel, facultatif)
- Playwright (export PDF, facultatif)
- Licence
- MIT
Ressources similaires
Tout voir- Gratuit
GratuitVidéo
Un seul grand chiffre
- 463463 téléchargements
- 223223 mentions J'aime
- 100100 sauvegardes
Compatible avec+ HyperFrames- Claude Code
- Codex
- Cursor
- et 3 autres
PROVidéo
PalateKit Motion, la bibliothèque
- 338338 téléchargements
- 198198 mentions J'aime
- 249249 sauvegardes
Compatible avec+ HyperFrames- Claude Code
- Codex
- Cursor
- et 3 autres
PROVidéo
Trois barres face à face
- 348348 téléchargements
- 133133 mentions J'aime
- 182182 sauvegardes
Compatible avec+ HyperFrames- Claude Code
- Codex
- Cursor
- et 3 autres
PROVidéo
Avant / après au curseur
- 322322 téléchargements
- 248248 mentions J'aime
- 238238 sauvegardes
Compatible avec+ HyperFrames- Claude Code
- Codex
- Cursor
- et 3 autres
PROVidéo
Carrousel de trois cartes
- 418418 téléchargements
- 157157 mentions J'aime
- 101101 sauvegardes
Compatible avec+ HyperFrames- Claude Code
- Codex
- Cursor
- et 3 autres
PROVidéo
Échange en bulles
- 564564 téléchargements
- 127127 mentions J'aime
- 161161 sauvegardes
Compatible avec+ HyperFrames- Claude Code
- Codex
- Cursor
- et 3 autres
PROVidéo
Liste qui se coche
- 442442 téléchargements
- 233233 mentions J'aime
- 160160 sauvegardes
Compatible avec+ HyperFrames- Claude Code
- Codex
- Cursor
- et 3 autres
Ce que vous obtenez
- SKILL.md : le déroulé en six phases, traduit en français
- STYLE_PRESETS.md : 12 préréglages visuels avec couleurs, polices et éléments signature
- viewport-base.css et html-template.md : la base CSS obligatoire et l'architecture HTML
- animation-patterns.md : des animations CSS/JS classées par effet recherché
Pour qui
- Préparer un pitch ou une présentation commerciale sans passer par PowerPoint
- Donner un cours ou une conférence avec une présentation au style soigné
- Transformer un fichier PowerPoint existant en page web animée
Pas pour qui
- Produire un fichier .pptx modifiable dans PowerPoint
- Créer des graphiques de données complexes et interactifs
- Les équipes qui n'ont besoin que d'un modèle de diapositives très sobre
Étiquettes
- présentation
- diapositives
- html
- pitch
- animation
À propos
Vous dites
« Crée-moi un pitch deck de 12 diapositives pour ma boutique de céramique, avec un style chaleureux et éditorial. »
Skill publiée par zarazhangrui sous licence MIT, traduite par PalateKit.
Voir plusVoir moins
Prérequis
- À préparer
- Le sujet et le contenu (texte, notes ou fichier PowerPoint) et Vos images ou votre logo, si vous en avez
- Dépendances
- Un navigateur web, Node.js (déploiement Vercel, facultatif) et Playwright (export PDF, facultatif)
Comment l'utiliser
- Installez la skill dans le dossier de skills de votre agent
- Demandez une présentation et répondez aux questions de départ
- Choisissez parmi les trois aperçus de style, puis relisez le résultat dans le navigateur
Aperçu du contenu
Fichiers
- .gitignore0,1 Ko
- animation-patterns.md4 Ko
- html-template.md11,5 Ko
- LICENSE1,1 Ko
- NOTICE-PALATEKIT.md0,4 Ko
- README.md35,3 Ko
- SKILL.md33,1 Ko
- STYLE_PRESETS.md8,3 Ko
- viewport-base.css2,8 Ko
Origine et licence
Modifié par PalateKit
- Auteur
- zarazhangrui
- Source
- github.com/zarazhangrui/frontend-slides/tree/9906a34d640d2111f724544cbc50f7f130569ae1/
- Licence
- MIT
Notice
Version modifiée de « frontend-slides » (zarazhangrui, MIT) : traduction française et fiche par PalateKit.
Avis des utilisateurs
–
Aucune note pour l'instant
Chargement des avis…
Questions fréquentes
Faut-il installer des outils ?
Non pour créer la présentation : le résultat est un fichier HTML autonome. Node.js n'est utile que pour le déploiement sur Vercel et Playwright pour l'export PDF. Les scripts cités dans le texte ne sont pas fournis avec cette version, l'agent peut les recréer si vous les demandez.
Puis-je changer les couleurs et les polices après coup ?
Oui. Les couleurs sont des variables CSS dans :root, la police se change dans le lien de police, et les animations passent par la classe .reveal.