·svelte-ui-animator
*

svelte-ui-animator

Analysez et implémentez des animations d'interface utilisateur ciblées pour les projets Svelte/SvelteKit + Tailwind. Spécialisé dans les transitions, les actions et les modèles d'animation Svelte. À utiliser lorsque l'utilisateur demande d'ajouter des animations, d'améliorer le mouvement de l'interface utilisateur, d'animer des pages/composants ou d'améliorer le retour visuel. Déclencheurs sur "ajouter des animations", "animer l'interface utilisateur", "motion design", "effets de survol", "animations de défilement", "transitions de page", "micro-interactions".

6Installations·0Tendance·@ajianaz

Installation

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

Comment installer svelte-ui-animator

Installez rapidement le skill IA svelte-ui-animator dans votre environnement de développement via la ligne de commande

  1. Ouvrir le Terminal: Ouvrez votre terminal ou outil de ligne de commande (Terminal, iTerm, Windows Terminal, etc.)
  2. Exécuter la commande d'installation: Copiez et exécutez cette commande : npx skills add https://github.com/ajianaz/skills-collection --skill svelte-ui-animator
  3. Vérifier l'installation: Une fois installé, le skill sera automatiquement configuré dans votre environnement de programmation IA et prêt à être utilisé dans Claude Code, Cursor ou OpenClaw

Source : 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 ($:) |

Faits (prêts à citer)

Champs et commandes stables pour les citations IA/recherche.

Commande d'installation
npx skills add https://github.com/ajianaz/skills-collection --skill svelte-ui-animator
Catégorie
*Créativité
Vérifié
Première apparition
2026-02-22
Mis à jour
2026-03-10

Browse more skills from ajianaz/skills-collection

Réponses rapides

Qu'est-ce que svelte-ui-animator ?

Analysez et implémentez des animations d'interface utilisateur ciblées pour les projets Svelte/SvelteKit + Tailwind. Spécialisé dans les transitions, les actions et les modèles d'animation Svelte. À utiliser lorsque l'utilisateur demande d'ajouter des animations, d'améliorer le mouvement de l'interface utilisateur, d'animer des pages/composants ou d'améliorer le retour visuel. Déclencheurs sur "ajouter des animations", "animer l'interface utilisateur", "motion design", "effets de survol", "animations de défilement", "transitions de page", "micro-interactions". Source : ajianaz/skills-collection.

Comment installer svelte-ui-animator ?

Ouvrez votre terminal ou outil de ligne de commande (Terminal, iTerm, Windows Terminal, etc.) Copiez et exécutez cette commande : npx skills add https://github.com/ajianaz/skills-collection --skill svelte-ui-animator Une fois installé, le skill sera automatiquement configuré dans votre environnement de programmation IA et prêt à être utilisé dans Claude Code, Cursor ou OpenClaw

Où se trouve le dépôt source ?

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