<div class="bg-green"></div>
<div class="bg-light"></div>
<h2>CUSTOM TEXT</h2>
div {
  position: absolute;
}
.bg-green {
  background: #361fb5;
  width: 230px;
  height: 80px;
  z-index: 2;
}
.bg-light {
  background: #f5f5f5;
  width: 600px;
  height: 80px;
  z-index: 1;
}
h2 {
  font-size: 80px;
  color: #fff;
  white-space: nowrap;
  position: absolute;
  top: -65px;
  left: 0;
  z-index: 4; 
  mix-blend-mode: difference;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.