Radial image cover

Your HTML markup

<div class="holder">
   <img src="http://lorempixel.com/500/500/sports/"/>
   <div class="radial"></div>
</div>

Your CSS

.holder {
   width: 500px;
   height: 500px;
   position: relative;
}

.radial {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,ffffff+0,000000+68 */
   background: transparent; /* Old browsers */
   background: -moz-radial-gradient(center, ellipse cover, rgba(0, 0, 0, 1) 0%, transparent 0%, rgba(0, 0, 0, 1) 68%); /* FF3.6-15 */
   background: -webkit-radial-gradient(center, ellipse cover, rgba(0, 0, 0, 1) 0%, transparent 0%, rgba(0, 0, 0, 1) 68%); /* Chrome10-25,Safari5.1-6 */
   background: radial-gradient(ellipse at center, rgba(0, 0, 0, 1) 0%, transparent 0%, rgba(0, 0, 0, 1) 68%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#000000', endColorstr='#000000', GradientType=1); /* IE6-9 fallback on horizontal gradient */
}

See example in codepen http://codepen.io/rizopoulos/pen/LkzKbd