DEV Community

Takane Ichinose
Takane Ichinose

Posted on

#CodepenChallenge Click: Subscribe Call to Action

A micro interaction of a subscription card. When clicked, the card will become a circle, and then a check mark will be drawn.

This time, I didn't make a separate function for the other functionality of a React component. All are just in a nested function.

I used GSAP to animate the elements.

The bell icon came from FontAwesome. I only used one icon from them this time.

I used the Open Sans font. I directly took it from the Assets part of this pen. Though, the font is uploaded on Google Fonts.

Discussion (2)

Collapse
ironcladdev profile image
IroncladDev

Wow! So nice! I subscribed about five times lol.

Collapse
takaneichinose profile image
Takane Ichinose Author

Thank you! Glad you liked it! :D