Печатает и стирает
typed.js-паттерн Волна веса шрифта →

Появление текста

Печатает и стирает

Фразы печатаются с живым темпом, стираются и сменяются по кругу.

Подождите полный цикл.

Сайты, которые

Код
Сайты, которые <span class="typed"
  data-phrases="продают|запоминаются|летают"></span><i class="cursor"></i>

<style>
.cursor { display: inline-block; width: 3px; height: .95em;
  background: #E84B16; animation: b .8s steps(1) infinite; }
@keyframes b { 50% { opacity: 0; } }
</style>

<script>
var el = document.querySelector(".typed");
var list = el.getAttribute("data-phrases").split("|");
var pi = 0, ci = 0, del = false;
(function tick() {
  var w = list[pi];
  if (!del) {
    el.textContent = w.slice(0, ++ci);
    if (ci === w.length) { del = true; return setTimeout(tick, 1600); }
    return setTimeout(tick, 55 + Math.random() * 45);  // живой темп
  }
  el.textContent = w.slice(0, --ci);
  if (ci === 0) { del = false; pi = (pi + 1) % list.length;
    return setTimeout(tick, 350); }
  setTimeout(tick, 28);
})();
</script>
Промпт для ИИ
Сделай ротатор с печатью (typed.js-паттерн): список фраз в data-phrases через |; цикл: печать по букве с живым темпом 55-100мс (добавляй Math.random), пауза 1.6s на дочитывание, стирание по 28мс, пауза 0.35s, следующая фраза по кругу. Рядом мигающий курсор-палочка (steps(1), 50% opacity 0). Акцентный цвет для печатаемого слова. При prefers-reduced-motion показать первую фразу статично.