
from everything-openai-codex9
Foundation motion tokens, spring presets, accessibility rules, and SSR-safe animation patterns for React/Next.js using motion/react.
Defines a foundation layer of motion primitives and rules for React/Next.js projects using motion/react. It standardises duration tokens, spring presets, and accessibility gates (prefers-reduced-motion), and provides SSR-safe patterns to avoid hydration mismatches. The skill codifies when to animate, which properties are safe, and provides shared token maps and helper hooks so downstream skills can implement consistent, performant animations.
Use this skill when starting any animated UI work: building components that animate, establishing design-system motion tokens, enforcing accessibility-friendly defaults, or debugging hydration-related animation issues. Activate it when you need predictable, cross-cutting motion behavior across a codebase.
shouldAnimate() gate, SSR mounting patterns, and explicit rules (no layout animations, always use tokens, guard for reduced-motion).Compatible with developer-focused agents and coding assistants that work with React and Next.js codebases (Copilot, Codex, Cursor, Gemini CLI). The skill is language-agnostic but tailored to JS/TS React environments.
This skill has not been reviewed by our automated audit pipeline yet.