Free Tailwind CSS Button Animations

Hi everyone,

These buttons were made using Riva Dashboard Tailwind CSS from Loopple.

Code:

<button class="bg-primary hover:bg-primaryActive text-white text-sm py-2.5 px-5 mr-2 mb-2 rounded-xl shadow-md hover:translate-y-[-2px] transition duration-300">
    Rise
</button>
<button class="bg-danger hover:bg-dangerActive text-white text-sm py-2.5 px-5 mr-2 mb-2 rounded-xl shadow-md hover:scale-105 transition duration-300">
    Scale
</button>
<button class="bg-success hover:bg-successActive text-white text-sm py-2.5 px-5 mr-2 mb-2 rounded-xl shadow-md hover:rotate-3 transition duration-300">
     Rotate to end
</button>
<button class="bg-warning hover:bg-warningActive text-white text-sm py-2.5 px-5 mr-2 mb-2 rounded-xl shadow-md hover:-rotate-3 transition duration-300">
     Rotate to start
</button>

You can also check the full list of components here: Riva Tailwind Dashboard Builder components

Thank you!

Comments

[Fredy Andrei]

Great component!