.wrapper {
  position: relative;
  width: 200px;
  height: 200px;
}
.wrapper img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: -1;
}
.triangle {
  width: 0;
  height: 0;
  position: absolute;
  z-index: 2;
  border-color: transparent;
  border-style: solid;
  border-width: 0;
  transform: scale(1.001);
}

.top .triangle {
  top: 0;
}
.bottom .triangle {
  bottom: 0;
}
.left.triangle {
  left: 0;
  border-left-color: white;
}
.right.triangle {
  right: 0;
  border-right-color: white;
}