Easiest Way to Create Custom Animated Gradients with Looping Motion (Figma + Jitter)
7.3K views · 2025-06-17
Motion DesignUI Design
🚀 Grab instant access for free (limited time) to the effekt.community → https://effekt.design/#community
Want to create smooth, animated gradient loops with your own colors, shapes, and motion in minutes?
This short guide walks you through how to:
✅ Design dynamic gradients in Figma
✅ Animate and control motion in Jitter
✅ Customize loops, timing, easing, and direction
✅ Export as video, gif, or live embed
No plugins. No code. 100% editable online.
Perfect for:
→ Hero sections, landing pages, UI shots, and brand motion
→ Designers who want something better than presets
🎯 Built for speed, made for customization.
---
Timestamps:
00:00 - What you will learn
01:30 - Creating your custom gradient on Figma
12:20 - Animating your gradient on Jitter
Want to create smooth, animated gradient loops with your own colors, shapes, and motion in minutes?
This short guide walks you through how to:
✅ Design dynamic gradients in Figma
✅ Animate and control motion in Jitter
✅ Customize loops, timing, easing, and direction
✅ Export as video, gif, or live embed
No plugins. No code. 100% editable online.
Perfect for:
→ Hero sections, landing pages, UI shots, and brand motion
→ Designers who want something better than presets
🎯 Built for speed, made for customization.
---
Timestamps:
00:00 - What you will learn
01:30 - Creating your custom gradient on Figma
12:20 - Animating your gradient on Jitter