
Motion Framer
by freshtechbro1da73febff0cNo license1K starsListed Oct 8, 2026Updated Oct 8, 2026Repository updated 10 months ago
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.
Only the file list is public. File contents are available once the skill is installed in a workspace.
| Path | Size | Type |
|---|---|---|
| assets/examples/README.md | 72.3 KB | text/markdown |
| assets/starter_motion/index.html | 958 B | text/plain |
| assets/starter_motion/package.json | 452 B | application/json |
| assets/starter_motion/README.md | 6.6 KB | text/markdown |
| assets/starter_motion/src/App.css | 1.7 KB | text/plain |
| assets/starter_motion/src/App.jsx | 3.4 KB | text/plain |
| assets/starter_motion/src/components/DraggableBox.jsx | 1.4 KB | text/plain |
| assets/starter_motion/src/components/HoverCard.jsx | 803 B | text/plain |
| assets/starter_motion/src/components/StaggerList.jsx | 1.5 KB | text/plain |
| assets/starter_motion/src/main.jsx | 208 B | text/plain |
| assets/starter_motion/vite.config.js | 210 B | text/plain |
| references/api_reference.md | 20 KB | text/markdown |
| scripts/animation_generator.py | 15.2 KB | text/plain |
| scripts/variant_builder.py | 13.6 KB | text/plain |
| SKILL.md | 20.5 KB | text/markdown |
Source and attribution
Source:freshtechbro/claudedesignskillsin.claude/skills/motion-framerat commit1da73fe
License: No license
Content belongs to its original authors. SourceWeft indexes it from a public repository.
More from freshtechbro/claudedesignskills

Web3d Integration Patterns
freshtechbro
Architecture patterns for combining Three.js, GSAP, React Three Fiber, Motion and React Spring in 3D web apps.

Threejs Webgl
freshtechbro
Guides Three.js WebGL/WebGPU development for interactive 3D web scenes, with reference docs and a starter scene.

Substance 3d Texturing
freshtechbro
Guides PBR texture creation and export from Substance 3D Painter for web and real-time engines, with Python batch automation.

Scroll Reveal Libraries
freshtechbro
Guides use of the AOS library for simple scroll-triggered reveal animations on web pages.

Rive Interactive
freshtechbro
Guides building interactive Rive vector animations in React using state machines, inputs, ViewModels and events.

Pixijs 2d
freshtechbro
Guides building high-performance 2D graphics, particle effects, and interactive canvases with the PixiJS WebGL/WebGPU engine.
More in Software Development

Playground
anthropics
Builds self-contained interactive HTML playgrounds with controls, live preview, and copyable prompt output.

M5 Onboard
anthropics
Provisions M5Stack ESP32 boards by detecting them on USB, flashing UIFlow 2.0 firmware, and installing a MicroPython app bundle.

Cardputer Buddy
anthropics
Guides iterating on a Cardputer-Adv MicroPython app bundle: adding apps, pushing files over USB-serial, tailing logs, and running REPL commands.

Web Design Guidelines
vercel-labs
Reviews UI code against Web Interface Guidelines fetched from a remote source and reports findings as file:line entries.

Vercel React Native Skills
vercel-labs
React Native and Expo best-practice rules covering list performance, animation, navigation, UI patterns, state, and monorepo setup.

Vercel React Best Practices
vercel-labs
Vercel's React and Next.js performance guidelines, organized as 70 rules for writing, reviewing, and refactoring code.