前端开发

react-spring

dylantarre/anim…inciples

Use when implementing Disney's 12 animation principles with React Spring's physics-based animations

  • 523 次安装
  • 133 星标
  • 收录于

安装命令

npx skills add https://github.com/dylantarre/animation-principles --skill react-spring

SKILL.md

React Spring Animation Principles

Implement all 12 Disney animation principles using React Spring's spring physics system.

1. Squash and Stretch

const [springs, api] = useSpring(() => ({
  scaleX: 1,
  scaleY: 1,
  config: { tension: 300, friction: 10 }
}));

api.start({ scaleX: 1.2, scaleY: 0.8 });
<animated.div style={springs} />

2. Anticipation