Understanding the Easing in CSS

We can easily understand this movement with the help of simple physical knowledge:

1. Ease-in: slow at the beginning, fast at the end (commonly used for outgoing elements)
2. Ease-out: fast at the beginning, slow at the end (commonly used for incoming elements)
3. Ease-both: slow on both sides
4. No-ease/linear: an object that moves at a constant speed