Production-ready animation and gesture library for React and modern JavaScript.
Included Components
100
MotionDocsDocsExamplesExamplesUIUIAI KitAIAI KitAIStudioStudioMotion+MotionHero sectionsPricing sectionsTestimonialsBento gridsStats sectionsNavigationCTA sectionsFootersPage transitionsFAQ sectionsOverlaysButtonsListsLoaders<Accordion><AddToBasket><ArrowLink><BorderBeam><CardStack><CarouselControls><CommandPalette><Confetti><CopyButton><Coverflow><ExpandCard><FooterReveal><HoldToConfirm><MagneticPull><MaskWipe><MultiStateButton><Overlay><PageCurtain><ParallaxLayers><ProgressBar><RollingTextButton><ScrambleReveal><ScreenshotScrollReveal><ScrollSpotlight><ScrollWordReveal><ScrollZoomReveal><SegmentedToggle><Sheet><ShrinkHeader><Skeleton><SmoothTabs><Sparkline><SplitReveal><StaggerReveal><SwipeActions><TerminalSession><TiltCard><ToastStack>Toast StackInstall guideGet Motion+Get MotionExamplesMagazinePartnersTroubleshootingAI KitCSS StudioMotion StudioMotionScoreThe Book of MotionReact animationLayout animationSVG animationMotion componentGSAP vs MotionJavaScriptReactVueRSS: ChangelogRSS: MagazineX/TwitterYouTubeLoginPurchaseUnlock the Toast stack componentAPI reference<Toast /><ToastStack />HooksuseToastStackuseToastFeatured inRelated examplesNewsletterSpring Physics CoreLayout Morph AnimationGesture RecognizerScroll Timeline DriverExit Animate Presence
Motion (formerly Framer Motion) is the production-ready animation engine powering modern web aesthetics. Created by Matt Perry, Motion combines declarative syntax, physics-based springs, multi-touch gestures, and layout morphing with buttery 60fps performance across React and vanilla JavaScript.
