Типографика · splittype

SplitType

Режет текст на буквы/слова/строки — топливо для GSAP-типографики

Tier 1Легко с AIОк на мобилеfree (MIT)Vanilla JS + часто GSAP

Design DNA

«Буквы появляются по одной, волны и stagger — кинетическая типографика без After Effects.»

Use with AI

Скопируй промпт и отдай агенту. Он реализует решение в твоём стеке — не копирует чужой код.

Подключи SplitType для одного hero-заголовка.
Разбей на chars или words, анимируй через GSAP (stagger).
На mobile упрости. prefers-reduced-motion → показать текст сразу.
Не сплить весь контент страницы. Учти: альтернатива — GSAP SplitText (Club GreenSock).

Что умеет

·split chars / words / lines
·Подготовка DOM под letter-анимации
·Связка с GSAP timelines / ScrollTrigger

Чего не умеет

·Не анимирует сам — нужен GSAP/Anime/CSS
·Ломает SEO/выделение, если не аккуратно

Когда брать

·Hero с появлением по буквам
·Кинетическая типографика

Когда не брать

·Обычный абзац без motion
·Нужен платный GSAP SplitText как альтернатива

С чем сочетается

GSAPScrollTriggerAnime.jsCurtains.js

Альтернативы

GSAP SplitText (платный Club)Splitting.js

Типичные ошибки

·Сплит всего текста на странице
·Забыть aria / reduced-motion
·Путать с GSAP SplitText

Демо и ссылки

SplitType (GitHub) GSAP SplitText