Animation de texte CSS

3894 bintangbaraadyasta

Ouvrir dans l'éditeur Publiez votre code

Recommandé

24 September 2025

Extrait HTML d'animation cérébrale CSS

25 November 2025

Code source HTML5 du jeu Recoil débloqué

13 May 2025

Page de connexion Roblox HTML CSS

HTML

CSS

html,
body {
  height: 100%;
  overflow: hidden;
  user-select: none;
}
body {
  display: flex;
  align-items: center;
  justify-content: center;
  background: radial-gradient(#000000, #000);
}
h1 {
  font: 300 80px/1 courier;
  white-space: nowrap;
  color: whitesmoke;
}
span {
  display: inline-block;
  animation: stretch 2.5s cubic-bezier(0.4, 1.4, 0.75, 0.9) infinite;
  transform-origin: center;
}
span:nth-of-type(1) {
  animation-delay: 0.25s;
}
span:nth-of-type(2) {
  animation-delay: 0.5s;
}
span:nth-of-type(3) {
  animation-delay: 0.75s;
}
span:nth-of-type(4) {
  animation-delay: 1s;
}
span:nth-of-type(5) {
  animation-delay: 1.25s;
}
span:nth-of-type(6) {
  animation-delay: 1.5s;
}
span:nth-of-type(7) {
  animation-delay: 1.75s;
}
span:nth-of-type(8) {
  animation-delay: 2s;
}
span:nth-of-type(9) {
  animation-delay: 2.25s;
}
span:nth-of-type(10) {
  animation-delay: 2.5s;
}
@keyframes stretch {
  5% {
    transform: scaleX(5000);
    opacity: 0.1;
  }
  15% {
    transform: scaleX(1);
    opacity: 1;
  }
}

Recommandé

Extrait HTML d'animation cérébrale CSS

Code source HTML5 du jeu Recoil débloqué

Page de connexion Roblox HTML CSS

HTMLCopy

CSSCopy

JSCopy

HTML

CSS

JS