Box shadow css transition

Give transition on box shadow

div {
  height: 200px;
  width: 200px;
  box-shadow: 0;
  transition: box-shadow 1s;
  border: 1px solid #eee;
}

div:hover {
  box-shadow: 0 0 3px #515151;
  ;
}

Box shadow css transition

/* Scale up the box */
.box:hover {
  transform: scale(1.2, 1.2);
}

/* Fade in the pseudo-element with the bigger shadow */
.box:hover::after {
  opacity: 1;
}

Source: tobiasahlin.com

Similar codes

3 votes287 views3 answers
Svg animation css
CSS
0 vote335 views1 answer
Spanning Items Across Rows and Columns
CSS
61 votes295 views2 answers
Bootstrap flex direction column
CSS
2 votes277 views1 answer
Not hover css
CSS
0 vote344 views2 answers
Wpa avoid reload with swipe
CSS
0 vote296 views1 answer
Table td css
CSS
22 votes316 views5 answers
Center grid
CSS
0 vote275 views1 answer
Add a class to header
CSS
8 votes282 views2 answers
Invert css
CSS
109 votes288 views6 answers
Position absolute
CSS