<svg>
  <symbol id="word">
    <text text-anchor="middle" x="50%" y="60%">
      These are my words
      
    </text>
  </symbol>
  <use href="#word"></use>
</svg>
@import url('https://fonts.googleapis.com/css2?family=Libre+Baskerville&display=swap');

body{
  font-family:'Libre Baskerville', serif;
  background: gray;
}
svg{
  position:absolute;
  top:50%;
  left:50%;
  transform: translate(-50%,-50%);
  width:100%;
  height:350px;
}

svg text{
  font-size:120px;
  fill: rgba(0,0,0,0.3);
  stroke-width: 2px;
  stroke:white;
  stroke-linejoin: round;
  /*stroke-dasharray: 80;*/
  
  animation-name: animate; 
  animation-duration:2s;
  animation-iteration-count: infinite;
  animation-timing-function: ease;
}

@keyframes animate{
  from {
    stroke-dasharray: 80;
  }
  to {
    stroke-dasharray: 160;
  }
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.