gsap

Creating a Menu Image Animation on Hover

By Mary Lou on July 1, 2020

A tutorial on how to create a hover effect for a menu where images appear with an animation on each item.

Making Stagger Reveal Animations for Text

By Mary Lou on June 17, 2020

A short tutorial on how to recreate a letter stagger animation with GSAP and Splitting.js.

Rapid Image Layers Animation

By Mary Lou on April 7, 2020

A rapid animation of multiple layers of images for intros or page transitions.

Motion Paths – Past, Present and Future

By Cassie Evans on December 3, 2019

The ability to animate along a motion path is a really useful thing to have in your SVG animation toolkit. Let's explore a few ways to achieve this, including the up

The New Features of GSAP 3

By Christina Gorton on November 14, 2019

Learn about all the exciting new features of GSAP 3 in this easy-to-follow overview.

Draggable Image Strip

By Mary Lou on June 11, 2019

A draggable image strip layout with a content preview powered by Draggabilly and TweenMax.

Interactive Repulsion Effect with Three.js

By Ion D. Filho on December 6, 2018

A tutorial on how to recreate the interactive repulsion effect of grid items seen in BestServedBold's Dribbble shot "Holographic-Interactions".

Page Flip Layout

By Mary Lou on November 12, 2018

A template with a two-sided, magazine-like layout and a flat page flip animation. The layout is powered by CSS Grid.

Grid Layout with Motion Hover Effect and Content Preview

By Mary Lou on May 23, 2018

A retro-style grid layout with a playful motion hover effect on the grid items. When clicking on a grid item, a content preview opens.

Creative SVG Strokes Animation

By Alaric Baraou on December 5, 2017

A creative strokes animation of a bike illustration powered by SVG and GSAP.

How to Create an Interactive Animated SVG Drum Kit

By Josh Ellis on March 16, 2016

A tutorial on how to create an animated and interactive SVG drum kit with GSAP and jQuery.

Elastic Progress

By Lucas Bebber on September 23, 2015

An elastic SVG progress loader based on the Dribbble shot "Download" by xjw and implemented with SVG and TweenMax.

Creating a “Jump Loader” Animation with SVG and GSAP

By Chris Gannon on March 25, 2015

Learn how to create a playful "Jump Loader" animation with SVG and GSAP.