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

0 vote337 views1 answer
The Sass .sass file is visually different from .scss file, e.g. Example.scss - sassy css is the new syntax as of Sass 3
CSS
19 votes350 views6 answers
Css text border
CSS
3 votes405 views2 answers
Ui gradient
CSS
93 votes399 views6 answers
Css center image in div
CSS
0 vote343 views1 answer
Button not aligning right css
CSS
0 vote340 views1 answer
System ui font
CSS
22 votes383 views5 answers
Grid center
CSS
4 votes366 views1 answer
Ionic mobile always dark theme in web
CSS
0 vote388 views1 answer
Repeating-conic-gradient css
CSS
0 vote376 views1 answer
How to give rgba in tailwind
CSS