Search everything...

Stats

Actions

Available In

framer-motion

Name: framer-motion
Author: schoepplake

By Schoepplake

Animation skill for React/Next.js with Motion (Framer Motion).

npx claudepluginhub schoepplake/framer-motion-skill --plugin framer-motion

Popularity

Stars

Above avg

Med: 0·Avg: 285

Installs

Med: 0·Avg: 1

What's Inside

Skills1

framer-motion

/framer-motion

Production-grade animation patterns for React and Next.js using Motion (formerly Framer Motion). Use this skill whenever the user asks to animate components, add transitions, create scroll-triggered effects, implement page transitions, layout animations, gesture interactions, or any kind of motion/animation in a React or Next.js project. Also trigger when code imports 'framer-motion', 'motion/react', or 'motion/react-client', or when the user mentions: animation, transition, fade-in, slide, parallax, scroll animation, exit animation, AnimatePresence, motion.div, spring, gesture, drag, hover animation, stagger, whileInView, or layout animation.

README

Framer Motion Skill for Claude Code

Production-grade animation patterns for React and Next.js using Motion (formerly Framer Motion).

What's included

Correct imports (motion/react, motion/react-client, framer-motion)
Core patterns: motion.* components, MotionValues, transitions
Scroll animations: whileInView, useScroll, useSpring
Exit animations: AnimatePresence
Stagger with variants
Layout animations / layoutId
Gesture animations (hover, tap, drag)
Accessibility: useReducedMotion
Performance rules
Recipes: progress bar, counter, page transition, gradient shimmer

Installation

claude plugin marketplace add Schoepplake/framer-motion-skill
claude plugin install framer-motion@framer-motion-skill

License

MIT

Similar Plugins

cache-components

140.1k·94·

Expert guidance for Next.js Cache Components and Partial Prerendering (PPR). Proactively activates in projects with cacheComponents: true, providing patterns for 'use cache' directive, cacheLife(), cacheTag(), cache invalidation, and parameter permutation rendering.

v1.0.0

vercel

caveman

71.9k·6.6K·

Ultra-compressed communication mode. Cuts ~75% of tokens while keeping full technical accuracy by speaking like a caveman.

v1.9.0

JuliusBrussee

frontend-design

30.2k·663·

Frontend design skill for UI/UX implementation

v1.0.0

anthropics

ui-design

35.7k·318·

Comprehensive UI/UX design plugin for mobile (iOS, Android, React Native) and web applications with design systems, accessibility, and modern patterns

3mo

v1.0.3

wshobson

claude-mem

83.0k·304·

Memory compression system for Claude Code - persist context across sessions

v13.6.2

thedotmack

marketing-skills

33.7k·278·

Marketing skills for AI agents — conversion optimization, copywriting, SEO, paid ads, ad creative, and growth

v2.5.1

coreyhaines31

Stats

Version1.0.1

Stars1

MaintenanceFair

Last CommitMar 20, 2026

AddedMay 9, 2026

Actions

View on GitHub View README Plugin Marketplace JSON

Own this plugin?

Verify ownership to unlock analytics, metadata editing, and a verified badge. GitHub access is read-only (username + org membership).

Available In

framer-motion-skill1

framer-motion

Popularity

What's Inside

README

Framer Motion Skill for Claude Code

What's included

Installation

License

Similar Plugins

cache-components

caveman

frontend-design

ui-design

claude-mem

marketing-skills

Confidence

Popularity

Health & Quality

Similar Plugins

cache-components

caveman

frontend-design

ui-design

claude-mem

marketing-skills