.wrapper {
}

.div1 {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100px;
  height: 100px;
  background-color: red;
  clip-path: polygon(
   50% 0%,
   100% 50%,
   50% 100%,
   0% 50%
  );
} 

.div2 {
  position: absolute;
  top: 10px;
  left: 0px;
  width: 100px;
  height: 100px;
  background-color: green;
  clip-path: polygon(
   50% 0%,
   100% 50%,
   50% 100%,
   0% 50%
  );
} 

.div3 {
  position: absolute;
  top: 20px;
  left: 0px;
  width: 100px;
  height: 100px;
  background-color: blue;
   clip-path: polygon(
   50% 0%,
   100% 50%,
   50% 100%,
   0% 50%
  );
}