키네틱 타이포그래피

<div class="stage"><div class="line" id="line"></div></div>

.line{display:flex;flex-wrap:wrap;justify-content:center;font:800 7vmin/1.3 system-ui,-apple-system,"Apple SD Gothic Neo",sans-serif;color:var(--fg);max-width:92%}
.line .word{display:inline-flex}
.line .sp{width:.3em;flex:none}
.line .ch{display:inline-block;animation:bounce 1.8s ease-in-out infinite}
@keyframes bounce{0%,100%{transform:translateY(0);opacity:.35}50%{transform:translateY(-.28em);opacity:1}}

const words = ['MOVE', '움직임'];
const line = document.getElementById('line');
let globalIndex = 0;
words.forEach(function(word, wi){
  if (wi > 0) {
    const sp = document.createElement('span');
    sp.className = 'sp';
    line.appendChild(sp);
  }
  const group = document.createElement('span');
  group.className = 'word';
  [...word].forEach(function(ch){
    const s = document.createElement('span');
    s.className = 'ch';
    s.textContent = ch;
    s.style.animationDelay = (globalIndex * 0.08) + 's';
    group.appendChild(s);
    globalIndex++;
  });
  line.appendChild(group);
});