CSS-анимация, переходы, ключевые кадры и современные API-интерфейсы движения. Используйте при добавлении анимации, переходов, эффектов прокрутки или переходов просмотра. Используйте для css-анимации, перехода, ключевых кадров, переходов просмотра, анимации прокрутки, преобразования, настройки движения, временной шкалы анимации.
Быстро установите AI-навык css-animation-patterns в вашу среду разработки через командную строку
Источник: oakoss/agent-skills.
CSS animations and transitions provide hardware-accelerated motion for web interfaces using keyframes, transitions, transforms, and modern scroll-driven and view transition APIs. Animate only composite properties (transform, opacity, filter) for smooth 60fps performance, and always respect prefers-reduced-motion.
The browser rendering pipeline has four stages: Style, Layout, Paint, and Composite. Animating composite-only properties skips Layout and Paint entirely, running on the GPU compositor thread. This is the single most important performance principle for CSS animation.
Modern CSS adds two powerful APIs: scroll-driven animations link keyframe progress to scroll position or element visibility instead of time, and the View Transitions API creates snapshot-based animated transitions between DOM states for both SPAs and MPAs.
CSS-анимация, переходы, ключевые кадры и современные API-интерфейсы движения. Используйте при добавлении анимации, переходов, эффектов прокрутки или переходов просмотра. Используйте для css-анимации, перехода, ключевых кадров, переходов просмотра, анимации прокрутки, преобразования, настройки движения, временной шкалы анимации. Источник: oakoss/agent-skills.
Стабильные поля и команды для ссылок в AI/поиске.
npx skills add https://github.com/oakoss/agent-skills --skill css-animation-patternsCSS-анимация, переходы, ключевые кадры и современные API-интерфейсы движения. Используйте при добавлении анимации, переходов, эффектов прокрутки или переходов просмотра. Используйте для css-анимации, перехода, ключевых кадров, переходов просмотра, анимации прокрутки, преобразования, настройки движения, временной шкалы анимации. Источник: oakoss/agent-skills.
Откройте терминал или инструмент командной строки (Terminal, iTerm, Windows Terminal и т.д.) Скопируйте и выполните эту команду: npx skills add https://github.com/oakoss/agent-skills --skill css-animation-patterns После установки навык будет автоматически настроен в вашей AI-среде разработки и готов к использованию в Claude Code, Cursor или OpenClaw
https://github.com/oakoss/agent-skills