Motion Patterns
affaan-m/eccAnimations make your website feel smooth and alive. This skill gives you ready-made animation patterns for React and Next.js. You can animate buttons, modals, toasts, page transitions, scroll effects, and more.
Every pattern follows best practices. It uses shared motion-foundations tokens and springs. You never need to write raw numbers. Just copy and paste.
Accessibility is built in. Animations work with screen readers and server-side rendering. The patterns handle exit animations, list staggers, and layout changes safely.
Add Motion Patterns skill to your workflow
Global
mkdir -p ~/.claude/skills/motion-patternsProject
mkdir -p .claude/skills/motion-patternsSource Repository
More Frontend Development Claude Code Skills
Frontend Designanthropics/skills
Create striking frontend interfaces with bold design and polished code every time
Vercel React Best Practicesvercel-labs/agent-skills
Optimize React and Next.js apps using proven Vercel performance guidelines
Vercel Composition Patternsvercel-labs/agent-skills
Clean React components with composition instead of boolean props
Shadcnshadcn/ui
Manage shadcn UI components easily with CLI commands and clear styling rules
Design Taste Frontendleonxlnx/taste-skill
Enforce premium frontend design with metric-based rules and smart component architecture
Impeccablepbakaus/impeccable
Polish your frontend interfaces with expert design critique and code
Minimalist Uileonxlnx/taste-skill
Build warm minimal web interfaces with editorial typography and flat bento grids
Industrial Brutalist Uileonxlnx/taste-skill
Raw mechanical UIs fusing Swiss print with military terminal aesthetics and high data density