Question

At my web page I have background: gray, and now I need to add a white shadow circle such as shown in the picture. One of my decisions is to add url:('../img/background.png') no-repeat gray but I can’t connect the colors because the image had a vertical gradient.

I think that it is possible to do this using CSS 3, am I right?

Answer 1

That’s radial gradient.

body {
  width: 600px;
  height: 300px;
  background-image: -o-radial-gradient(circle, #fff, #b1b5be 150px);
  background-image: -moz-radial-gradient(circle, #fff, #b1b5be 150px);
  background-image: -webkit-radial-gradient(circle, #fff, #b1b5be 150px);
  background-repeat: no-repeat;
}

Live demo: Tinkerbin