This week I've seen a few people trying to replicate this button hover animation created by Edoardo Mercati.

I challenged myself to create the animation but using framer motion, a popular animation library for React. In addition, I added a few props to be able to change the color and the text of the button. This way, I can customize the animation to suit different themes and purposes.

I learned a lot from this challenge and I’m pretty happy with the final result.

You can find the code for this project on GitHub, feel free to contribute:
https://github.com/eduardconstantin/react-motion-components

And I also set up a website on Vercel:
https://react-motion-components.vercel.app