Effetto testo 3D

1511 ledoc

Apri nell'Editor Video Pubblica il Tuo Codice

Consigliato

20 December 2025

Visualizzazione della rete neurale 3D (Three.js)

22 September 2025

Gioco di cubi 3D HTML con statistiche e personalizzazione

22 November 2025

Effetto passaggio del mouse sul pulsante CSS Liquid Glass

HTML

CSS

.waveTextAnimated {
  margin-top: 0.6em;
  font-size: 50px;
  text-align: center;
}

.waveTextAnimated span {
  display: inline-block;
  -webkit-animation: wave-text 1s ease-in-out infinite;
  animation: wave-text 1s ease-in-out infinite;
}

.waveTextAnimated span:nth-of-type(1) {
  -webkit-animation-delay: 0s;
  animation-delay: 0s;
}
.waveTextAnimated span:nth-of-type(2) {
  -webkit-animation-delay: 0.1s;
  animation-delay: 0.1s;
}
.waveTextAnimated span:nth-of-type(3) {
  -webkit-animation-delay: 0.2s;
  animation-delay: 0.2s;
}
.waveTextAnimated span:nth-of-type(4) {
  -webkit-animation-delay: 0.3s;
  animation-delay: 0.3s;
}
.waveTextAnimated span:nth-of-type(5) {
  -webkit-animation-delay: 0.4s;
  animation-delay: 0.4s;
}

@-webkit-keyframes wave-text {
  00% {
    transform: translateY(0em);
  }
  60% {
    transform: translateY(-0.6em);
  }
  100% {
    transform: translateY(0em);
  }
}

@keyframes wave-text {
  00% {
    transform: translateY(0em);
  }
  60% {
    transform: translateY(-0.6em);
  }
  100% {
    transform: translateY(0em);
  }
}

Consigliato

Visualizzazione della rete neurale 3D (Three.js)

Gioco di cubi 3D HTML con statistiche e personalizzazione

Effetto passaggio del mouse sul pulsante CSS Liquid Glass

HTMLCopy

CSSCopy

JSCopy

HTML

CSS

JS