Менять цвет логотипа над блоком
 

Здравствуйте! Подскажите как можно сделать что то подобное:
https://codepen.io/eighthday/pen/MKqBjX

Только нужно что бы не дублировать логотип.

К примеру, в header есть два лого (img) - черный и белый... Когда он находится над белом фоне, должен показыватся черный логотип - а когда он над черном фоне - показывать белый. Как в примере выше!

По такому принцепу:

<div class="logo fixed">
  <img src="#logo-white">
  <img src="#logo-black">
</div>

<div class="block-black"></div>
<div class="block-white"></div>

Какие есть варианты? Спасибо!

Можно использовать в качестве фона.

Достаточно белого логотипа и mix-blend-mode: difference;

https://codepen.io/Malleys/pen/LYEmyBR?editors=1100

Malleys,
:thanks: