DEMOs

导航页

将两图重叠,上方图片使用反色和半透明(-webkit-filter: invert(100%) opacity(50%);),计算颜色((255-c1) + c2) / 2,相同部分为rgb(127.5, 127.5, 127.5)

image one image two
image one image two
.img-diff {
  position: relative;

  .img {
    width: 90%;
    max-width: torem(350px);
  }

  .diff {
    position: absolute;
    filter: invert(100%) opacity(50%);
    top: 0;
    left: 0;
  }
}