Learn Animation

Make your website pop with eye-catching animations. Read these free animation tutorials to master CSS and JavaScript techniques for creating successful animations.
Read moreRead less
All content
Courses
Tutorials

All Animation content:

  1. Best Free Canvas Libraries in JavaScript

    Best Free Canvas Libraries in JavaScript

    Tutorial • Beginner

    Let's look at some of the best canvas libraries in JavaScript. These can be used for visualizing data or creating simple animations and particle systems.

  2. Best Free and Open-Source JavaScript Animation Libraries

    Best Free and Open-Source JavaScript Animation Libraries

    Tutorial • Beginner

    I'll show you eight of the best free and open-source JavaScript animation libraries that you can use in your projects today.

  3. How to Build a Coming Soon Page With Lottie Animations

    How to Build a Coming Soon Page With Lottie Animations

    Tutorial • Intermediate

    In a previous tutorial, we learned how to include Adobe After Effects animations on a page using the Lottie for Web library. Today, we’ll learn how to repeat...

  4. Build a JavaScript Page Loading Animation With GSAP

    Build a JavaScript Page Loading Animation With GSAP

    Tutorial • Beginner

    In today’s tutorial, we’ll learn how to create a JavaScript page loading animation with GSAP, one of the most dominant and popular JavaScript animation...

  5. How to Create Smooth Page Transitions with JavaScript

    How to Create Smooth Page Transitions with JavaScript

    Tutorial • Intermediate

    In this JavaScript tutorial you’ll learn how to create an animated page transition with a JavaScript library called Highway.

  6. How to Add Adobe After Effects Animations to a Web Page

    How to Add Adobe After Effects Animations to a Web Page

    Tutorial • Beginner

    Complex animations are increasingly implemented in web pages and applications, so today I’ll explain how to add Adobe After Effects animations to a web page.

  7. Beginner to Advanced With Adobe XD Auto-Animate

    Beginner to Advanced With Adobe XD Auto-Animate

    Course • Beginner

    Master the art of Adobe XD animation in this free Adobe XD tutorial. You'll learn how to use Adobe XD auto-animate to bring your prototypes to life! Adobe...

  8. Try Our Practical Web Animation Course, With New Bonus Projects!

    Try Our Practical Web Animation Course, With New Bonus Projects!

    Tutorial • Beginner

    Join the thousands of people who have learned web animation in our popular course, Practical Web Animation. Try some of the brand new projects we've added.

  9. Practical Web Animation

    Practical Web Animation

    Course • Intermediate

    The days of animation-heavy websites are fading, but there is still something to be said for a site with small amounts of subtle, eye-catching motion to help...

  10. How to Draw Patterns with CSS Using CSS Doodle

    How to Draw Patterns with CSS Using CSS Doodle

    Tutorial • Intermediate

    CSS helps us get creative in all kinds of ways, and today we’re going to take our CSS creativity to the next level. We’re going to use a tool called CSS...

  11. Better Data Presentation for Infographics: Practical Animation Examples

    Better Data Presentation for Infographics: Practical Animation Examples

    Tutorial • Beginner

    Using the animation framework we created previously, in this tutorial you’ll learn how to animate three infographic examples: data counters, progress bars,...

  12. Create an Animated SVG Logo for International Women’s Day 2019

    Create an Animated SVG Logo for International Women’s Day 2019

    Tutorial • Beginner

    To mark International Women's Day 2019 we’ll be creating an animated SVG version of the event’s logo you can use along with this year’s hashtag...

Related Categories

CSS
HTML/CSS
UI Design
Sketch
Unlimited Downloads
From $16.50/month
Get access to over one million creative assets on Envato.
Over 9 Million Digital Assets
Everything you need for your next creative project.
Create Beautiful Logos, Designs
& Mockups in Seconds
Design like a professional without Photoshop.
Join the Community
Share ideas. Host meetups. Lead discussions. Collaborate.