Float Animation
FREE
A float animation for elements
Demo
Exclusive Launch 50% offspots left: 0 / 50
$39.99
$19.99
Payment once and get lifetime access
Access to all animations
All updates
All animations
No subscriptions
Installation
1
Copy and paste the following code into your project.
Add the keyframes and animation to the global.css file.
@layer utilities {
// START HERE ------------------------------------------------------------
.animate-float {
animation: float 3s ease-in-out infinite;
}
@keyframes float {
from {
transform: translateY(0);
}
to {
transform: translateY(-20px);
}
}
// END HERE ------------------------------------------------------------
}2
Use the class animate-float-custom to apply the animation to an element.
<div className="animate-float">
<!-- Your content here -->
</div>3
Start using the animation
