Plugins

info

A plugin adds extra capabilities to GSAP's core. This allows the GSAP core to remain relatively small and lets you add features only when you need them.

Plugin Overview

Included in GSAP's Core

• GSAP

Tween and Timeline

Animate anything

• CSS properties
• Attributes
• Array Values
• and more...

Eases

• "none"
• "power1"
• "power2"
• "power3"
• "power4"
• "back"
• "bounce"
• "circ"
• "elastic"
• "expo"
• "sine"
• "steps(n)"

Animate efficiently

• Staggers
• Callbacks
• Snapping
• Modifiers
• Keyframes
• Ticker with lag smoothing
• Cleanup - context() & revert()
• Responsivity & Accessibility - matchMedia()

Utility Methods

• checkPrefix()
• clamp()
• distribute()
• getUnit()
• interpolate()
• mapRange()
• normalize()
• pipe()
• random()
• selector()
• shuffle()
• snap()
• splitColor()
• toArray()
• unitize()
• wrap()
• wrapYoyo()

Scroll Plugins

• ScrollTriggerpopular
• ScrollTo
• ScrollSmoother

  requires ScrollTrigger

Text Plugins

• SplitTextpopular
• ScrambleText
• Text Replacement

SVG Plugins

• DrawSVGpopular
• MorphSVG
• MotionPath
• MotionPathHelper

UI Plugins

• Flippopular
• Draggable
• Inertia
• Observer

Other Plugins

• Physics2D
• PhysicsProps
• GSDevTools
• Easel
• Pixi

Eases

• CustomEasepopular
• EasePack

  rough, slow, and expoScale
• CustomWiggle

  requires CustomEase
• CustomBounce

  requires CustomEase

React

• useGSAP()popular

Installing/Loading a plugin

At the end of the day, all the plugins are just JS files - just like the core library. You can install them with script tags, via npm, with yarn, or even with a tgz file.

Head on over to our install helper to choose your own adventure.

Registering a plugin

Registering a plugin with the GSAP core ensures that the two work seamlessly together and also prevents tree shaking issues in build tools/bundlers. You only need to register a plugin once before using it, like:

//list as many as you'd like
gsap.registerPlugin(MotionPathPlugin, ScrollTrigger, MorphSVGPlugin);

Obviously you need to load the plugin file first. There is no harm in registering the same plugin multiple times (but it doesn't help either).