WEBLEB
Accueil
Éditeur
Connexion
Pro
Français
English
Français
Español
Português
Deutsch
Italiano
हिंदी
texte animé
2440
Lilian
Ouvrir dans l'éditeur
Publiez votre code
Recommandé
10 July 2025
Exemple d'écran de chargement animé CSS HTML
9 September 2024
Champ de mot de passe animé
22 August 2024
Carte animée avec effet de survol 3D
HTML
Copy
R
U
S
N
A
K
_
L
I
L
I
A
N
CSS
Copy
<style> body{ margin: 0; padding: 0; background: #262626; } ul{ position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); margin: 0; padding: 0; display: flex; } ul li{ list-style: none; font-family: arial; font-size: 3em; letter-spacing: 15px; text-shadow: none; animation: animate 1s infinite linear; } @keyframes animate{ 0%{ color: #484848; text-shadow: none; } 18%{ color:#484848; text-shadow: none; } 20%{ color: rgb(57, 255, 7); text-shadow: 0 0 7px #00d5ff ,0 0 20px #f6ff00; } 30%{ color: #484848; text-shadow: none; } 35%{ color: rgb(0, 255, 0); text-shadow:0 0 7px #00ccff ,0 0 20px #f6ff00; } 70%{ color:#484848; text-shadow: none; } 85%{ color: rgb(1, 255, 1); text-shadow: 0 0 7px #00ffe1 ,0 0 20px #f6ff00; } 90%{ color: #484848; text-shadow: none; } 100%{ color:#484848; text-shadow: none; } } ul li:nth-child(1){ animation-delay: .2s; } ul li:nth-child(2){ animation-delay: .4s; } ul li:nth-child(3){ animation-delay: .6s; } ul li:nth-child(4){ animation-delay: .8s; } ul li:nth-child(5){ animation-delay: .1s; } ul li:nth-child(6){ animation-delay: .1.2s; } ul li:nth-child(7){ animation-delay: .1.4s; } ul li:nth-child(8){ animation-delay: .1.6s; } ul li:nth-child(9){ animation-delay: .1.8s; } ul li:nth-child(10){ animation-delay: .2s; } ul li:nth-child(11){ animation-delay: .2.2s; } ul li:nth-child(12){ animation-delay: .2.4s; } ul li:nth-child(13){ animation-delay: .2.6s; } </style>
JS
Copy
/* Replace with your JS Code (Leave empty if not needed) */