Comment utiliser : Confettis CSS
- L'aperçu démarre avec des confettis aux couleurs variées.
- Réglez le nombre de morceaux, leur taille et leur vitesse ; Balancement les fait onduler.
- Désactivez Couleurs variées pour n'utiliser qu'une couleur de marque.
- Copiez le code sur votre page de remerciement ou de confirmation.
Des confettis qui tournoient
Chaque morceau est un petit rectangle qui tombe en se balançant légèrement tout en tournant en 3D (rotate3d) ; il alterne ainsi entre sa face et sa tranche, comme un vrai morceau de papier. Les couleurs sont attribuées à chaque morceau grâce à une propriété personnalisée CSS.
Pour la neige, la pluie ou vos propres formes, consultez le Générateur d'animation de particules.
Aussi recherché comme : animation confettis css, confettis qui tombent css, effet confettis site web, css confettis, animation confettis en arrière-plan, animation de célébration css.
Outils complémentaires : Confettis CSS
- Effet neige CSS — Faites neiger votre site pour les fêtes : neige douce ou flocons, légères bourrasques ou tempête.
- Animation d'étoiles filantes — Faites traverser à des étoiles filantes un héros de ciel nocturne, ou laissez des formes d'étoiles descendre en tournoyant.
- Animation pluie CSS — Faites pleuvoir sur une page ou une section héros, d'une fine bruine à une averse inclinée.
- Générateur d’animation CSS — Concevez vos animations CSS sur une vraie timeline de keyframes.
Questions fréquentes
Comment ajouter des confettis sur une page de remerciement ?
Copiez le HTML et le CSS, puis collez-les dans la page. Les confettis tombent en continu par-dessus la page et ne bloquent pas les clics.
Puis-je utiliser les couleurs de ma marque ?
Désactivez Couleurs variées et choisissez votre couleur, ou modifiez les valeurs --c dans le HTML.
Les confettis peuvent-ils n'apparaître qu'une seule fois au lieu de boucler ?
Ce générateur crée des chutes continues. Pour une explosion unique, remplacez infinite par 1 dans la règle d'animation afin que chaque morceau ne tombe qu'une fois.
Puis-je installer Confettis CSS en tant qu’application web et l’utiliser hors ligne ?
Oui. Confettis CSS est une application web installable (PWA) : elle s’installe depuis votre navigateur, sans passer par une boutique d’applications. Cliquez sur « Installer l’application » en haut de cette page dans Chrome ou Edge (Windows, macOS, Linux, ChromeOS) ; sur Android, utilisez « Partager » → « Ajouter à l’écran d’accueil » sur iPhone et iPad ; ou « Fichier » → « Ajouter au Dock » dans Safari 17+ sur Mac. L’application s’ouvre alors dans sa propre fenêtre avec sa propre icône, et comme elle s’exécute entièrement dans votre navigateur, elle continue de fonctionner hors ligne. Firefox sur ordinateur de bureau ne permet pas d’installer d’applications web. Comment fonctionne l’installation.