CSS Zoom on Hover - Lena Design

Demo:

To create the CSS Zoom on Hover effect follow the steps below:

Hover over the square to see the effect:

Step1.

Add HTML

<div class="square"></div>

Step2.

Add CSS

.square {
  background-color: #2a9d8f;
  transition: transform .2s;
  width: 100px;
  height: 100px;  
}

.square:hover {
  transform: scale(1.4); 
}

Enjoy coding!