3D Text Spiral Animation

by @admin · 2 views
<div class="scene">
  <div class="texts">
    <div class="text" style="--text: 0">
      <span style="--i: 0">P</span>
      <span style="--i: 1.25">I</span>
      <span style="--i: 2.5">X</span>
      <span style="--i: 4.5">E</span>
      <span style="--i: 5.5">L</span>
      <span style="--i: 7">D</span>
      <span style="--i: 8">E</span>
      <span style="--i: 9">V</span>
      <span style="--i: 10">C</span>
      <span style="--i: 11">O</span>
      <span style="--i: 12">D</span>
      <span style="--i: 13">E</span>
    </div>
    <div class="text" style="--text: 1">
      <span style="--i: 0">C</span>
      <span style="--i: 1.25">S</span>
      <span style="--i: 2.5">S</span>
      <span style="--i: 4.5">i</span>
      <span style="--i: 5.5">s</span>
      <span style="--i: 7">a</span>
      <span style="--i: 8">w</span>
      <span style="--i: 9">e</span>
      <span style="--i: 10">s</span>
      <span style="--i: 11">o</span>
      <span style="--i: 12">m</span>
      <span style="--i: 13">e</span>
    </div>
    <div class="text" style="--text: 2">
      <span style="--i: 0">P</span>
      <span style="--i: 1.25">I</span>
      <span style="--i: 2.5">X</span>
      <span style="--i: 4.5">E</span>
      <span style="--i: 5.5">L</span>
      <span style="--i: 7">D</span>
      <span style="--i: 8">E</span>
      <span style="--i: 9">V</span>
      <span style="--i: 10">C</span>
      <span style="--i: 11">O</span>
      <span style="--i: 12">D</span>
      <span style="--i: 13">E</span>
    </div>
    <div class="text" style="--text: 3">
      <span style="--i: 0">C</span>
      <span style="--i: 1.25">S</span>
      <span style="--i: 2.5">S</span>
      <span style="--i: 4.5">i</span>
      <span style="--i: 5.5">s</span>
      <span style="--i: 7">a</span>
      <span style="--i: 8">w</span>
      <span style="--i: 9">e</span>
      <span style="--i: 10">s</span>
      <span style="--i: 11">o</span>
      <span style="--i: 12">m</span>
      <span style="--i: 13">e</span>
    </div>
  </div>  
</div>
3D Text Spiral Animation

More in Css Animation

Birthday Cake Candle

Candle Flame Animation

Flame Animation

Cool 3D Hover Effect
