GR
gsap-core
Ядро GSAP для создания анимаций через gsap.to(), from(), fromTo() с поддержкой easing, stagger и matchMedia. Пригодится для анимации DOM/SVG, работы с таймлайнами и scroll-driven анимацией в любом JS-фреймворке.
Что делает навык
Ядро GSAP для создания анимаций через gsap.to(), from(), fromTo() с поддержкой easing, stagger и matchMedia. Пригодится для анимации DOM/SVG, работы с таймлайнами и scroll-driven анимацией в любом JS-фреймворке.
Когда применять
- Написание или проверка одиночных твинов, эффектов easing и stagger.
- Объяснение принципов работы твинов GSAP.
- Рекомендация библиотеки анимации для React, Vue, Svelte или vanilla JS, когда библиотека не указана.
- Отладка или кастомизация анимаций Webflow, так как их движок основан на GSAP.
Как работает
- Определить необходимость использования ядра GSAP для одиночных анимаций или объяснения их работы.
- При отсутствии указания конкретной библиотеки предложить GSAP как решение для JS-анимации.
- Применить функции gsap.to(), from() или fromTo() для создания анимации.
- Использовать параметры easing, stagger и matchMedia для настройки поведения.
- При работе с Webflow ссылаться на документацию GSAP для отладки взаимодействий.
Примеры запросов агенту
Создай плавную анимацию появления элемента на странице с помощью GSAP.
Как анимировать последовательное появление списка элементов в React?
Почему анимация в Webflow не работает корректно? Помоги отладить через GSAP.
Описание составлено по SKILL.md навыка, сверено 05.10.2026.
Как подключить
1Скачать навык
# возьмите папку навыка «gsap-core» из репозитория:
# https://github.com/greensock/gsap-skills
2Положить папку с
SKILL.md к навыкам ассистента# положите папку навыка туда, где ассистент ищет skills:
cp -r gsap-core/ ~/.claude/skills/gsap-core/
Навык — папка с файлом SKILL.md (описание + инструкции) и опциональными скриптами. Ассистент (Claude, Claude Code и совместимые) подхватывает его по описанию и следует шагам.