<div class="daire">
  <div class="duvar">Orijinal Resim</div>
  <div class="duvar multiply">multiply</div>
  <div class="duvar screen">screen</div>
  <div class="duvar overlay">overlay</div>
  <div class="duvar darken">darken</div>
  <div class="duvar lighten">lighten</div>
  <div class="duvar color-dodge">color-dodge</div>
  <div class="duvar color-burn">color-burn</div>
  <div class="duvar hard-light">hard-light</div>
  <div class="duvar soft-light">soft-light</div>
  <div class="duvar difference">difference</div>
  <div class="duvar exclusion">exclusion</div>
  <div class="duvar hue">hue</div>
  <div class="duvar saturation">saturation</div>
  <div class="duvar color">color</div>
  <div class="duvar luminosity">luminosity</div>
</div>

.daire {
  display: flex;
  flex-wrap: wrap;
}

.duvar {
  width: 320px;
  height: 211px;
  margin: 10px;
  background-image: url(https://lh3.googleusercontent.com/S6R3hlIIAUcaGWKadN2mp8myRdFDBFiS3TlLM4NMSSvzE49cMFin_ODX-W69biYjPrISBsvgtuhoYX-87AkXsEe1tgNc5hb2SH47aGM6EkWFyoy8xup8VDqv9g);
  background-color: red;
  font-size: 24px;
  color: #fff;
  text-shadow: 3px 3px 3px rgba(0,0,0,.8);
  text-align: center;
}

.multiply {
  background-blend-mode: multiply;
}

.screen {
  background-blend-mode: screen;
}

.overlay {
  background-blend-mode: overlay;
}

.darken {
  background-blend-mode: darken;
}

.lighten {
  background-blend-mode: lighten;
}
.color-dodge {
  background-blend-mode: color-dodge;
}

.color-burn {
  background-blend-mode: color-burn;
}

.hard-light {
  background-blend-mode: hard-light;
}

.soft-light {
  background-blend-mode: soft-light;
}

.difference {
  background-blend-mode: difference;
}

.exclusion {
  background-blend-mode: exclusion;
}

.hue {
  background-blend-mode: hue;
}

.saturation {
  background-blend-mode: saturation;
}

.color {
  background-blend-mode: color;
}

.luminosity {
  background-blend-mode: luminosity;
}