Awesome Open Source
Awesome Open Source


Motion Layout

Create beautiful immersive React hero animations using shared components.


React Motion Layout Docs



There are amazing libraries like framer-motion that help you create animations when mounting or unmounting components. But, if two routes have the same image in different positions and sizes, they cannot be animated together. With Motion Layout, you can link components together to animate them when changing views.

Browser support

Supported on modern versions of all major browsers including:

  • Chrome 56+
  • Firefox 27+
  • IE10+ (including Edge)
  • Safari (iOS) 7.1+
  • Safari (Mac) 9+
  • Firefox Mobile
  • Chrome for Android
  • Android Webview


Easy as wraping your text or images with our SharedElement component.


It doesn't require external state management libs.

Router Ready

Dispatch animations when changing routes using our React-Router Link component.

Get A Weekly Email With Trending Projects For These Topics
No Spam. Unsubscribe easily at any time.
javascript (68,779
react (5,308
reactjs (1,057
react-router (205
animations (161
transitions (55
animate (22

Find Open Source By Browsing 7,000 Topics Across 59 Categories