<img src="https://codyhouse.co/assets/img/gems/hero/3d-animated-mockup-featured-new.svg" />
<h1>
  Text On Image Using <br >
  mix-blend-mode in CSS<br>
  <small>Scroll Down To See Effect</small>
</h1>

body {
  margin : 0
}
img{
  width:100%;
  height:auto
}
h1{
  position: fixed;
  top: 50px;
  right: 20%;
  color:#ffb;
  mix-blend-mode: difference;
  text-align :center;
  font-size:4em;
}
small{
  font-size:16px;
  color: #dfafaa;
}