·svelte-ui-animator
*

svelte-ui-animator

Анализируйте и реализуйте целенаправленную анимацию пользовательского интерфейса для проектов Svelte/SvelteKit + Tailwind. Специализируется на переходах, действиях и шаблонах анимации Svelte. Используйте, когда пользователь просит добавить анимацию, улучшить движение пользовательского интерфейса, анимировать страницы/компоненты или улучшить визуальную обратную связь. Триггеры «добавить анимацию», «анимировать пользовательский интерфейс», «анимационный дизайн», «эффекты наведения», «анимацию прокрутки», «переходы страниц», «микровзаимодействия».

6Установки·0Тренд·@ajianaz

Установка

$npx skills add https://github.com/ajianaz/skills-collection --skill svelte-ui-animator

Как установить svelte-ui-animator

Быстро установите AI-навык svelte-ui-animator в вашу среду разработки через командную строку

  1. Откройте терминал: Откройте терминал или инструмент командной строки (Terminal, iTerm, Windows Terminal и т.д.)
  2. Выполните команду установки: Скопируйте и выполните эту команду: npx skills add https://github.com/ajianaz/skills-collection --skill svelte-ui-animator
  3. Проверьте установку: После установки навык будет автоматически настроен в вашей AI-среде разработки и готов к использованию в Claude Code, Cursor или OpenClaw

Источник: ajianaz/skills-collection.

Implement purposeful, performant animations using Svelte's built-in transitions and actions. Focus on key moments: hero intros, hover feedback, content reveals, and navigation transitions with Svelte's reactive nature.

| 1 | Hero Intro | First impression, brand personality | | 2 | Hover Interactions | Feedback, discoverability | | 3 | Content Reveal | Guide attention, reduce cognitive load | | 4 | Background Effects | Atmosphere, depth | | 5 | Navigation Transitions | Spatial awareness, continuity |

| Page load | CSS animation with animation-delay for stagger | | Scroll into view | Svelte actions with IntersectionObserver or on:viewportenter | | Hover | Tailwind hover: utilities or Svelte mouseenter/mouseleave | | Click/Tap | State-driven with Svelte reactive statements ($:) |

Факты (для цитирования)

Стабильные поля и команды для ссылок в AI/поиске.

Команда установки
npx skills add https://github.com/ajianaz/skills-collection --skill svelte-ui-animator
Категория
*Креатив
Проверено
Впервые замечено
2026-02-22
Обновлено
2026-03-10

Browse more skills from ajianaz/skills-collection

Короткие ответы

Что такое svelte-ui-animator?

Анализируйте и реализуйте целенаправленную анимацию пользовательского интерфейса для проектов Svelte/SvelteKit + Tailwind. Специализируется на переходах, действиях и шаблонах анимации Svelte. Используйте, когда пользователь просит добавить анимацию, улучшить движение пользовательского интерфейса, анимировать страницы/компоненты или улучшить визуальную обратную связь. Триггеры «добавить анимацию», «анимировать пользовательский интерфейс», «анимационный дизайн», «эффекты наведения», «анимацию прокрутки», «переходы страниц», «микровзаимодействия». Источник: ajianaz/skills-collection.

Как установить svelte-ui-animator?

Откройте терминал или инструмент командной строки (Terminal, iTerm, Windows Terminal и т.д.) Скопируйте и выполните эту команду: npx skills add https://github.com/ajianaz/skills-collection --skill svelte-ui-animator После установки навык будет автоматически настроен в вашей AI-среде разработки и готов к использованию в Claude Code, Cursor или OpenClaw

Где находится исходный репозиторий?

https://github.com/ajianaz/skills-collection

Детали

Категория
*Креатив
Источник
skills.sh
Впервые замечено
2026-02-22