Скролл-история

Караоке-манифест → пролёт сквозь кадр → заливка цветом → счётчики. Драматургия на один скролл.

Скрольте не останавливаясь.

Сначала манифест подсвечивается строка за строкой — целиком, а не по словам: читается спокойнее и весомее.

А эти строки выходят из блюра по одной, под вашу прокрутку, и уходят в туман при возврате.

сквозь кадр

и цвет забирает сцену

0сцены истории

0секунд на прочтение

0% внимания

Код

<!-- КОМБО-драматургия из четырёх сцен подряд:
     1. караоке-манифест   (сцена 260vh, слова наливаются по --p)
     2. пролёт сквозь фото (сцена 300vh, scale 1→3.6 + fade)
     3. заливка цветом     (сцена 230vh, clip-path волна снизу)
     4. счётчики           (обычная секция, числа по появлению)

     Все сцены — один паттерн:
     <section class="scene" data-scrub><div class="stick">…</div></section>
     движок пишет --p (0..1) с лерп-доводкой, CSS считает фазы. -->

<section class="karaoke-scene" data-scrub>…манифест…</section>
<section class="zoom-scene"    data-scrub>…фото…</section>
<section class="fill-scene"    data-scrub>…волна…</section>
<section class="stats">…счётчики…</section>

<!-- код каждой сцены — на страницах эффектов:
     «Караоке-подсветка», «Пролёт сквозь фото»,
     «Заливка цветом», «Счётчик чисел» -->

Промпт для ИИ

Собери скролл-историю из сцен подряд: построчная подсветка манифеста (строки наливаются целиком: k=clamp(p*N-i)), строки из блюра (filter blur (1-k)*12px + подъём), далее (драматургия важнее эффектов): (1) sticky-манифест 260vh — слова наливаются цветом по прогрессу (караоке-подсветка); (2) пролёт сквозь фото 300vh — кадр растёт scale 1→3.6 и растворяется после 72% прогресса; (3) заливка 230vh — фирменный цвет волной clip-path накрывает следующее фото с заголовком; (4) финал — счётчики, набегающие по появлению. Каждая сцена: секция с высотой Nvh, sticky-экран внутри, прогресс в CSS-переменной --p с лерп-доводкой 0.1. Между сценами не вставляй обычный контент — история должна идти без пауз.