文字やロゴ・写真などをただ載せるのではなく、何か別の要素を重ねてレイアウトするということはよく行いますが、さらに重ねた部分を色反転させる工夫を行うとデザインの幅が広がります。
以下のサンプルは、色反転の性質を持たせた要素を左に動かし、その背景にある色を反転させています。
白い背景部分は黒くなり、黒いロゴの部分は白くなる、という具合です。
Adobeのデザインツールなどでも、重ねた要素で色を反転させる効果をつけるということはできますが、Webでやることの利点は、動くものに対しても色反転効果をつけられることにあります。状況に応じて色を変化させることで、メリハリのついたデザインに仕上げることが可能です。
