Mix Blend Mode

by madvofirst

HTML

<span class="slideOutIcon" style="font-size:30px;cursor:pointer;" onclick="openNav()">☰</span>

<div class="stripe black"></div>
<div class="stripe white"></div>
<div class="stripe black"></div>
<div class="stripe white"></div>
<div class="stripe black"></div>
<div class="stripe black"></div>
<div class="stripe white"></div>
<div class="stripe black"></div>
<div class="stripe white"></div>
<div class="stripe black"></div>

CSS

body{
  background-color:white;
}
.slideOutIcon {
    color:white;
    mix-blend-mode: multiply;
    z-index:2;
 position:fixed;
}

.stripe{
  height:200px;
  width:100%;
}
.black{
  background-color:black;
}
.white{
  background-color:white;
}