🧪 Animation Tests
🎭 Fade Animations
⬆️ Fade Up
class="sat-fade-up"
⬇️ Fade Down
class="sat-fade-down"
⬅️ Fade Left
class="sat-fade-left"
➡️ Fade Right
class="sat-fade-right"
↖️ Fade Up-Left
class="sat-fade-up-left"
↗️ Fade Up-Right
class="sat-fade-up-right"
↙️ Fade Down-Left
class="sat-fade-down-left"
↘️ Fade Down-Right
class="sat-fade-down-right"
🔍 Zoom Animations
🔎 Zoom In
class="sat-zoom-in"
🔍 Zoom Out
class="sat-zoom-out"
🔎⬆️ Zoom In Up
class="sat-zoom-in-up"
🔎⬇️ Zoom In Down
class="sat-zoom-in-down"
🔎⬅️ Zoom In Left
class="sat-zoom-in-left"
🔎➡️ Zoom In Right
class="sat-zoom-in-right"
🔍⬆️ Zoom Out Up
class="sat-zoom-out-up"
🔍⬇️ Zoom Out Down
class="sat-zoom-out-down"
🔍⬅️ Zoom Out Left
class="sat-zoom-out-left"
🔍➡️ Zoom Out Right
class="sat-zoom-out-right"
➡️ Slide Animations
🔄 Flip Animations
🔄 Flip Left
class="sat-flip-left"
🔄 Flip Right
class="sat-flip-right"
🔄 Flip Up
class="sat-flip-up"
🔄 Flip Down
class="sat-flip-down"
⏱️ Duration Test
⚡ Fast (300ms)
sat-duration-300
🐌 Slow (1000ms)
sat-duration-1000
🐢 Very Slow (2000ms)
sat-duration-2000
⏰ Delay Test
0ms Delay
sat-delay-0
500ms Delay
sat-delay-500
1000ms Delay
sat-delay-1000
1500ms Delay
sat-delay-1500
2000ms Delay
sat-delay-2000
2500ms Delay
sat-delay-2500
3000ms Delay
sat-delay-3000
📈 Easing Functions Lengkap
📏 Linear
sat-easing-linear
📊 Ease
sat-easing-ease
📈 Ease In
sat-easing-ease-in
📉 Ease Out
sat-easing-ease-out
📊 Ease In-Out
sat-easing-ease-in-out
🎢 Ease In Back
sat-easing-ease-in-back
🎢 Ease Out Back
sat-easing-ease-out-back
🎢 Ease In-Out Back
sat-easing-ease-in-out-back
📈 Ease In Sine
sat-easing-ease-in-sine
📉 Ease Out Sine
sat-easing-ease-out-sine
📊 Ease In-Out Sine
sat-easing-ease-in-out-sine
📈 Ease In Quad
sat-easing-ease-in-quad
📉 Ease Out Quad
sat-easing-ease-out-quad
📊 Ease In-Out Quad
sat-easing-ease-in-out-quad
📈 Ease In Cubic
sat-easing-ease-in-cubic
📉 Ease Out Cubic
sat-easing-ease-out-cubic
📊 Ease In-Out Cubic
sat-easing-ease-in-out-cubic
📈 Ease In Quart
sat-easing-ease-in-quart
📉 Ease Out Quart
sat-easing-ease-out-quart
📊 Ease In-Out Quart
sat-easing-ease-in-out-quart
🎯 Combination Test
🔎⬆️ Zoom + Fade
Multiple Classes
🔄 Flip + Delay
Flip with 400ms delay
⚡ Performance Test
⚡ Optimized
sat-optimize (will-change)
📱 Mobile Disabled
sat-mobile-disable
🌀 Blur Animations
🌀 Simple Blur
class="sat-blur"
🌀⬆️ Blur Up
class="sat-blur-up"
🌀⬇️ Blur Down
class="sat-blur-down"
🌀⬅️ Blur Left
class="sat-blur-left"
🌀➡️ Blur Right
class="sat-blur-right"
🌀🔎 Blur Zoom In
class="sat-blur-zoom-in"
🌀🔍 Blur Zoom Out
class="sat-blur-zoom-out"
🥃 Glass Blur
class="sat-blur-glass"