# Animaxxing Skills — Agent Index

Compose one framework skill for lifecycle timing, a motion skill for effects, and a style when requested. Static restyles need only the style. Install alongside https://github.com/greensock/gsap-skills for API/plugin guidance. Each skill installs independently.

Framework skills include local references/initialization.md for readiness, recovery, and first-load performance, references/devices.md for touch, viewport changes, and device budgets, references/smooth-scroll.md for a scroller that survives navigation, and references/transition-archetypes.md for curtains, first-visit preloaders, shared-element morphs, and a WebGL canvas that persists across routes.

## Motion skills

[animaxxing](animaxxing/SKILL.md)
  Reusable vanilla TypeScript and GSAP text, scroll, pointer, endless drag, layout, media, component, hover, SVG, section paging, sound, and particle effects with text stability and technical checks. Preserve existing fonts, colors, and layout; no style skill required. The framework skill owns lifecycle timing.
  Triggers: animate without restyling, preserve branding, Animaxxing motion, split-text entrance, scattering headline, speak-in, letter wave, scroll reveal, scrub text, parallax, pinned section, horizontal scroll, scroll progress, magnetic button, tilt card, custom cursor, drag carousel, infinite carousel, endless loop gallery, horizontalLoop, throwable slider, infinite grid, draggable canvas, pan in any direction, Draggable InertiaPlugin, CustomEase, signature ease, custom easing curve, SVG line draw, icon morph, motion path, count-up number, marquee ticker, particle buttons, blast-off, smooth scroll, Lenis, ScrollSmoother, curtain transition, page wipe, preloader, loading counter, Flip, filter grid animation, reorder list, shared element, menu overlay, full-screen nav, dialog animation, modal enter exit, drawer, accordion, height auto, details summary, tab indicator, sliding underline, image reveal, clip-path wipe, hover image preview, scroll-scrubbed video, image sequence, frame sequence canvas, text roll, rolling label, underline sweep, link underline animation, image zoom on hover, hover stuck on touch, particle density on phones, full-screen sections, fullpage scroll, Observer, wheel paging, swipe between sections, scroll hijack, sound effects, UI sounds, audio toggle, ambient audio, mute.

[animaxxing-webgl](animaxxing-webgl/SKILL.md)
  GSAP-driven WebGL image effects on one shared OGL renderer and canvas: planes that track each img through scroll and resize, a hover lens, a scroll-velocity wave, and a reveal or exit wipe tweened on shader uniforms. The img stays the accessible content and the fallback for no WebGL, context loss, missing CORS, and reduced motion. Framework-free; the framework skill owns lifecycle timing.
  Triggers: WebGL image effect, shader hover, image distortion, displacement hover, scroll velocity wave, WebGL reveal, image wipe shader, uniforms, GSAP uniform tween, three.js images, OGL, DOM-synced plane, webgl canvas across routes, context lost, CORS texture.

## Framework skills

Shared triggers: initially hidden content, invisible intro, failed entrance, stalled fonts/media, late hydration, no-JavaScript fallback, first-load performance, loading flashes, auth-dependent content, layout shifts, mobile, touch, phone width, orientation change, low-end devices, smooth scroll across routes, scroll position after navigation, curtain transition, preloader, shared element across pages.

[gsap-vanilla](gsap-vanilla/SKILL.md)
  Plain HTML/CSS/JS: first paint, full-document or fetch/swap navigation, View Transitions, bfcache and prerendering.
  Triggers: static site, vanilla JS, FOUC, pageswap, pagereveal, Swup, Barba, Taxi.

[gsap-astro](gsap-astro/SKILL.md)
  Astro ClientRouter: swap hooks, script re-execution, persisted elements, and islands. Without ClientRouter, use gsap-vanilla.
  Triggers: Astro animation, astro:before-preparation, astro:page-load, transition:persist, duplicated animation.

[gsap-sveltekit](gsap-sveltekit/SKILL.md)
  SvelteKit on Svelte 5: navigation holds, page reuse, runes cleanup, Svelte transitions versus GSAP.
  Triggers: SvelteKit page transition, beforeNavigate, onNavigate, afterNavigate, goto, {#key}, $effect.

[gsap-nuxt](gsap-nuxt/SKILL.md)
  Nuxt 3/4: Vue page/layout hooks, done callbacks, leave ownership, keepalive, SSR.
  Triggers: Nuxt animation, NuxtPage, pageTransition, layoutTransition, onLeave, done never called.

[gsap-react-router](gsap-react-router/SKILL.md)
  React Router v7/v8: framework/data/declarative modes, blockers, Outlet reuse, pending UI, SSR.
  Triggers: React Router page transition, Remix, useBlocker, useNavigation, ScrollRestoration, viewTransition.

[gsap-tanstack-router](gsap-tanstack-router/SKILL.md)
  TanStack Router for React and TanStack Start: blockers, pending UI, presented route identity, remountDeps, SSR.
  Triggers: TanStack animation, @tanstack/react-router, @tanstack/react-start, useBlocker, pendingComponent, router.subscribe.

[gsap-nextjs](gsap-nextjs/SKILL.md)
  Next.js App Router: transition-aware links, cacheComponents route preservation, streaming, GSAP versus React View Transitions.
  Triggers: Next.js animation, App Router page transition, onNavigate, Activity, interrupted intro, data-ready entrances.

## Style skills

[style-animaxxing](style-animaxxing/SKILL.md)
  Monochrome editorial art direction: Rethink Sans, JetBrains Mono, poster type, hairlines, layout, and surface choices that configure animaxxing. Apply only when the user requests this look. For the full treatment, also load animaxxing and the matching framework skill; for a static restyle, omit animation.
  Triggers: animaxx it, Animaxxing look, Swiss monochrome redesign, Animaxxing design with minimal motion.