Subhan-code/oxygen-ui-solana

animate

Design and build web animations that feel right, grounded in the complete "Animations on the Web" course (animations.dev). Use proactively whenever building or improving motion — deciding whether to animate, choosing easing/duration/springs, implementing…

Idioma del texto original: inglés

animation-accessibility

Reduced motion for web animation — ship every animation as two variants so motion never makes someone sick or distracted. Use when adding or reviewing `prefers-reduced-motion` handling; when deciding what an animation should become under reduced motion; when…

Idioma del texto original: inglés

animation-performance

Frame budget for web motion — hold 60fps by animating composite-only properties and keeping animation off the main thread. Use when an animation is janky, choppy, or drops frames; when choosing which property to animate (`transform`/`opacity` vs…

Idioma del texto original: inglés

animation-vocabulary

Reverse-lookup glossary that turns a vague description of a web animation or motion effect into its exact term ("the bouncy thing when a popover opens" → Pop in; "the iOS rubber-band scroll" → Rubber-banding; "one shape turning into another" → Morph). Use…

Idioma del texto original: inglés

css-animations

Animate with CSS alone — transitions, `@keyframes`, transforms, 3D, and `clip-path` — at the craft bar of the "Animations on the Web" course (animations.dev). Use when writing or fixing CSS motion, deciding between a transition and a keyframe animation,…

Idioma del texto original: inglés

debug-animation

Diagnose an animation that feels off, janky, or broken and name the exact cause before touching code — the diagnosis loop from the "Animations on the Web" course (animations.dev). Use when an animation feels wrong but the user can't say why, when motion is…

Idioma del texto original: inglés

find-animation-opportunities

Searches a UI for the few places motion would genuinely help, and names what should stay static. Read-only.

Idioma del texto original: inglés

gesture-ui

Build drag, swipe, and sheet interactions that track the finger 1:1 and stay interruptible, the way the "Animations on the Web" course (animations.dev) teaches. Use when building or fixing anything the user drags, swipes, flings, holds, or dismisses with a…

Idioma del texto original: inglés

improve-animations

Audits a codebase's motion against the animations.dev craft bar and writes self-contained plans another agent can execute. Read-only on source code.

Idioma del texto original: inglés

motion-brief

Interview the user relentlessly about an animation before any of it gets built — one decision at a time, each with a recommended answer — until a motion brief has no blanks. Use when motion needs to be decided or stress-tested before it's implemented, when…

Idioma del texto original: inglés

motion-react

Build animations with Motion for React (`motion/react`, formerly Framer Motion) the way the "Animations on the Web" course (animations.dev) teaches — and debug them when the magic misfires. Use when writing motion components, exit animations, layout or…

Idioma del texto original: inglés

pick-ui-library

Picks the tool for a UI or motion task from the set the "Animations on the Web" course (animations.dev) actually uses and trusts, instead of hand-rolling a toast or installing whatever is trending. Use when choosing between CSS, WAAPI, Motion, GSAP and React…

Idioma del texto original: inglés

review-animations

Reviews animation and motion code against a high craft bar derived from the "Animations on the Web" course (animations.dev). Default to flagging; approval is earned.

Idioma del texto original: inglés

scroll-animations

Build scroll-triggered reveals and scroll-driven animation with the restraint and craft bar of the "Animations on the Web" course (animations.dev) — and know when a scroll animation shouldn't exist at all. Use when adding fade-in-on-scroll reveals to a…

Idioma del texto original: inglés