# 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, image trail, endless drag, layout, media, component, hover, SVG, section paging, sound, physics, and particle effects with text stability and technical checks. Single effects, or the full treatment: every element enters from a blank page, rests, and leaves. Preserve existing fonts, colors, and layout; no style skill required. The framework skill owns lifecycle timing.
  Triggers: we're animaxxing, animax this, full treatment, animate every element, intro and outro on every element, animate without restyling, preserve branding, Animaxxing motion, split-text entrance, implode text, explode text, letters fly in from all directions, letters blow apart, glitch text, glitch effect, signal glitch, RGB split alternative, distorted headline, ellipse line reveal, highlighter text reveal, marker sweep, scattering headline, speak-in, typewriter, typing effect, type on, blinking caret, typed text, rotating words, retype, letter wave, scroll reveal, scrub text, parallax, pinned section, stacking cards, sticky card stack, cards stack on scroll, zoom through, scroll zoom into image, expand image to full screen on scroll, clip-path grow to full bleed, horizontal scroll, parallax inside horizontal scroll, scroll waypoints, element travels between sections, Flip on scroll, product shot docks per section, scroll progress, nav color per section, header theme, hide header on scroll, scroll direction, sticky footer reveal, pop-in stickers, magnetic button, spotlight, flashlight reveal, cursor mask reveal, reveal on hover, direction-aware hover, directional fill, hover fill from entry side, tilt card, custom cursor, cursor label, view project cursor, image trail, cursor image trail, momentum hover, inertia hover, proximity scale, dock effect, macOS dock, scale by cursor distance, stickers scatter on hover, drag carousel, sortable list, drag to reorder, reorder list by dragging, keyboard reorder, swipe to dismiss, swipe away notification, dismiss card by swiping, infinite carousel, endless loop gallery, horizontalLoop, throwable slider, infinite grid, draggable canvas, pan in any direction, flick cards, card stack slider, swipe cards, fanned deck, Draggable InertiaPlugin, CustomEase, signature ease, custom easing curve, SVG line draw, icon morph, scroll morph, curved section edge,  motion path, text on a path, textPath, curved text, circular text badge, rotating badge, text along curve, count-up number, odometer, rolling digits, live counter, price ticker, marquee ticker, logo wall, logo cycle, client logos swap, particle buttons, confetti, emoji rain, Physics2DPlugin, gravity, blast-off, smooth scroll, Lenis, ScrollSmoother, curtain transition, tilted page transition, next page title transition, page wipe, clip-path page transition, curve swipe transition, liquid page transition, SVG path cover, page slides with the cover, preloader, loading counter, Flip, filter grid animation, reorder list, shared element, menu overlay, full-screen nav, dialog animation, modal enter exit, interruptible menu, different enter and exit, easeReverse, reverse ease, addPause timeline, drawer, accordion, height auto, details summary, tab indicator, loading button, submit button states, spinner to checkmark, success animation, button loading success error, sliding underline, image reveal, clip-path wipe, masked image shape, hover image preview, scroll-scrubbed video, image sequence, frame sequence canvas, press feedback, button press animation, click ripple, ink ripple, material ripple, squash on press, tap feedback, shake on error, error shake, wrong password shake, invalid input shake, font weight hover, variable font hover, widen on hover, hover layout shift, text reflow on hover, 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, a reveal or exit wipe, a glitch, a dissolve, a pixelation, and a ripple 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, image glitch, glitch shader, dissolve shader, pixelate image, mosaic reveal, ripple shader, image ripple, shader transition, 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.