DEV Community

Fabrício Ferrari de Campos
Fabrício Ferrari de Campos

Posted on

Fade In and Grow Effects

Objective

Hi! This pen shows how to use fade in an element using opacity and how to grow a text using scale. Additionally, it is show a transformation effect during the button hover and its appearance.

Transitions used

  • ease-in: during the initial welcome message hiding and also to show the new welcome message
  • cubic-bezier: during the button hover effect
  • ease: to ease the text transformation in the new welcome message

Top comments (0)