motion-framer — Skills — getagentictools

What it does

Building interactive UI components (buttons, cards, menus)

Creating micro-interactions and hover effects

Implementing page transitions and route animations

Adding scroll-based animations and parallax effects

Animating layout changes (resizing, reordering, shared element transitions)

Drag-and-drop interfaces

Complex animation sequences and state-based animations

motion framer

Source

Repository: https://github.com/freshtechbro/claudedesignskills

motion-framer FAQ

What does the motion-framer skill do?

Modern animation library for React and JavaScript. Create smooth, production-ready animations with motion components, variants, gestures (hover/tap/drag), layout animations, AnimatePresence exit animations, spring physics, and scroll-based effects. Use when building interactive UI components, micro-interactions, page transitions, or complex animation sequences. Building interactive UI components (buttons, cards, menus) Creating micro-interactions and hover effects

How do I install motion-framer?

Run: npx -y skills add https://github.com/freshtechbro/claudedesignskills --skill motion-framer --agent claude-code — the source lives at github.com/freshtechbro/claudedesignskills.

Maintain motion-framer?

Let people know it's listed here — add the badge (live metrics, light/dark aware) or a plain link to your README or docs.

[motion-framer on getagentictools](https://getagentictools.com/skills/freshtechbro-claudedesignskills-motion-framer?ref=badge)

npx agentictools info skills/freshtechbro-claudedesignskills-motion-framer

The second line is the CLI lookup for this page — handy in READMEs and docs.