SOURCE

<h1><span>L</span><span>a</span><span>s</span><span>e</span><span>r</span><span>&nbsp;</span><span>T</span><span>e</span><span>x</span><span>t</span></span></h1>

@import url("https://fonts.googleapis.com/css?family=Alegreya+Sans:300");
html, body {
  height: 100%;
  overflow: hidden;
  user-select: none;
}

body {
  display: flex;
  align-items: center;
  justify-content: center;
  background: radial-gradient(#1a1a1a, #000000);
}

h1 {
  font: 300 50px/1 Alegreya Sans, monospace;
  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: .1;
  }
  15% {
    transform: scaleX(1);
    opacity: 1;
  }
}