TweenNano is a super-lightweight (1.6k in AS3 and 2k in AS2) version of TweenLite and is ideal for situations where you cannot afford the extra 3.1k (4.7k total) that the normal TweenLite engine would cost and your project doesn't require any plugins. TweenNano can do everything TweenLite can do with the following exceptions:

  • No Plugins - One of the great things about TweenLite is that you can activate plugins in order to add features (like autoAlpha, tint, blurFilter, etc.). TweenNano, however, doesn't work with plugins.
  • Incompatible with TimelineLite and TimelineMax - Complex sequencing and management of groups of tweens can be much easier with TimelineLite and TimelineMax, but TweenNano instances cannot be inserted into TimelineLite or TimelineMax instances. Sequencing in TweenNano can be done using the "delay" special property.
  • Fewer overwrite modes - You can either overwrite all or none of the existing tweens of the same object (overwrite:true or overwrite:false) in TweenNano.
  • Fewer methods and properties- TweenNano instances aren't meant to be altered on-the-fly, so they don't have methods like pause(), resume(), reverse(), seek(), restart(), etc. The essentials are covered, though, like to(), from(), delayedCall(), killTweensOf(), and kill()

TweenNano uses exactly the same syntax as TweenLite, so all the documentation and examples for TweenLite apply to TweenNano as well (except for the features mentioned above of course).

For a measly 1.6k, TweenNano is surprisingly capable. It can tween as many properties as you want of any object, base timing on frames or seconds, use onComplete and onUpdate callbacks, make delayedCall()s, do from() tweens, kill all the tweens of a particular object, and TweenNano easily outperforms most other engines including Adobe's Tween class (by a wide margin).

Getting started

If you're new to the GreenSock Tweening Platform, check out the "getting started" page. You'll be up and running in no time.


Please see the full ASDoc documentation.

Sample AS3 code

(AS2 is identical except for property names like "x", "y", and "alpha" are "_x", "_y", "_alpha" and alpha would be 100-based instead of 1-based).

import com.greensock.*;
import com.greensock.easing.*;

//tweens mc's alpha property to 0.5 and x property to 120 from wherever they are currently over the course of 1.5 seconds., 1.5, {alpha:0.5, x:120});

//same tween, but uses the Back.easeOut ease, delays the start time by 2 seconds, and calls the "onFinishTween" function when it completes, passing two parameters to it, 5 and "myParam2"., 1.5, {alpha:0.5, x:120, ease:Back.easeOut, delay:2, onComplete:onFinishTween, onCompleteParams:[5, "myParam2"]});

//tweens mc into place from 100 pixels above wherever it currently is, over the course of 1 second using the Elastic.easeOut ease.
TweenNano.from(mc, 1, {y:"-100", ease:Elastic.easeOut});


    Do you plan on eventually making TweenNano compatible with plugins?
    No. I am not interested in blurring the line between TweenNano and TweenLite by adding plugin capability or other features to TweenNano. The sole purpose of TweenNano is to provide an extremely lightweight engine capable of doing basic tweening, nothing more. If you want plugin-like capabilities, you can always use TweenNano's onUpdate callback to have your own function perform any action every time the tween values are updated. I thought TweenLite was already lightweight. Why create TweenNano if it only saves 3.1k?
    Believe it or not, some developers (mostly banner ad creators) will rejoice at the thought of getting an extra 3.1k because they are forced to work within extremely tight file size constraints. That being said, if you're trying to decide whether you should use TweenNano or TweenLite, I'd recommend using TweenLite and only shifting to using TweenNano if that 3.1k becomes critical. TweenLite is definitely more flexible with its plugins and compatibility with TimelineLite and TimelineMax.
  1. How do I install the class? Do I have to import it on every frame?
    Please refer to the "getting started" page.
  2. Why do my tweens keep getting overwritten? How can I prevent that?
    By default, when you create a tween, TweenNano looks for all existing tweens of the same object and kills them immediately. However, you can prevent this behavior by using overwrite:false in your vars object, like, 1, {x:100, overwrite:false});
  3. Can I set up a sequence of tweens so that they occur one after the other?
    Sure. Just use the "delay" special property, like :

    import com.greensock.TweenNano;, 2, {x:100});, 1, {y:300, delay:2, overwrite:false});
  4. Do the properties have to be in a specific order?
    Nope. The only thing that matters is that the first parameter is the object you're tweening, the second parameter is the time (in seconds), and the third parameter contains all the properties you want to tween (in any order). So, 1, {scaleX:1.2, y:200, x:1}) is the same as, 1, {x:1, y:200, scaleX:1.2});
  5. Do I have to purchase a license to use this code? Can I use it for commercial purposes?
    You may use the code at no charge in commercial or non-commercial web sites, games, components, applications, and other software as long as end users are not charged a fee of any kind to use your product or gain access to it. If your client pays you a one-time fee to create the site/product, that's perfectly fine and qualifies under the "no charge" license. If multiple end users are charged a usage/access/license fee of any kind, please simply sign up for a corporate Club GreenSock membership which comes with a special commercial license granting you permission to do so. Club GreenSock members get several useful bonus plugins, classes, update notifications, SVN access, and more. Your support keeps this project going. Please see the licensing page for details on licensing.


Version: 2.1.3 updated 2019-05-18




        By using GreenSock code, you agree to the terms of use.

        Help support GreenSock by becoming a member

        Join Club GreenSock