Картинка наполовину черно-белая. Градиент

http://ru.stackoverflow.com/questions/549242/

by Gleb Kemarsky

HTML

<div class="progress"></div>

CSS

.progress {
  background-image: url(http://glebkema.ru/images/2015_09_20_iphone_155_x400.jpg), -webkit-linear-gradient( 0deg, #666 50%, transparent 50%);
  background-image: url(http://glebkema.ru/images/2015_09_20_iphone_155_x400.jpg),    -moz-linear-gradient( 0deg, #666 50%, transparent 50%);
  background-image: url(http://glebkema.ru/images/2015_09_20_iphone_155_x400.jpg),      -o-linear-gradient( 0deg, #666 50%, transparent 50%);
  background-image: url(http://glebkema.ru/images/2015_09_20_iphone_155_x400.jpg),         linear-gradient(90deg, #666 50%, transparent 50%);
  background-blend-mode: luminosity;
  height: 400px;
  width:  400px;
}