<div class="image">
  <div class="gradient"></div>
</div>

.image{
  background-image: url('https://www.sostav.ru/images/news/2018/06/15/zc9zvfgd.jpg');
  background-size: cover;
  width: 500px;
  height: 500px;
  position: relative;
  margin: 0 auto;
}
.gradient{
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  background-image: linear-gradient(to bottom, #fff, transparent 70%);
}