Framer UI Motion: Toggle

Learn the ins and outs of the new Framer API!


Design a basic toggle in Framer X


Sprinkle some animation magic


Use it on real web pages (like this one)!

Get Free Videos
hours of HD videos

And, it's more than just a toggle. It's a step-by-step guide to:


Design on canvas, animate with code
Transfer from design to code
Workflow tips

New Framer API

Animation mental model
Animation variants


Tricks to remember syntax
Coding best practices
Debugging tips


  1. What are we going to build?
  2. Draw a basic toggle
  3. Make the toggle "toggleable"
  4. Animation mental model
  5. Two-track toggle: Variants
  6. Blue sky, starry night
  7. Parallax of stars and clouds
  8. Wandering clouds
  9. Shooting stars!
  10. Drag
  11. Use the toggle to control the scene
  12. Export to CodeSandbox
Videos only
Enroll Now
🔥 Complete
Videos + Source files + Exercises
Enroll Now


If you are not completely satisfied with the course, you can get 100% refund within 30 days of your purchase. No hard feelings!
Linton’s tutorials are constructed very thoughtfully and string concepts together in a clear and useful way.
Ryder Booth
UX Lead, Cisco
👉 More Testimonials
Hi! I'm Linton!

I'm a full-stack developer and I love design. I've been teaching designers React since 2017 and I'm loving it! I'm also the author of a couple of courses at Treehouse and Lynda.

My dark little secret: 😈 creating this course is also my special way to learn all things about design and React -- trying to explain things clearly has taken my understanding of the concepts to a whole new level.

Thrilled to be on this journey with you!

Hey! I'm Beebee!

I'm a designer and animator. I draw inspiration from my dream diaries.

In my dreams, I saw mammoths chasing little bears on a circus. I managed to turn missiles launched from North Korea into splendid firework shows. I convinced the Emperor of Qin Dynasty to stop killing. I chatted with Prince Edwards in Chinese. I was left in awe by the weirdly breathtaking scenes made up of lily pads, lotus, water grass and pale dead fish...

What's in your dreams?

© 2021 jimu Labs, Inc.