background-blending-gradient-gradient.html (501B)
1 <!-- 2 Any copyright is dedicated to the Public Domain. 3 http://creativecommons.org/publicdomain/zero/1.0/ 4 --> 5 <html> 6 <style> 7 .reftest { 8 width: 200px; 9 height: 200px; 10 background-size: 100px 100px, 200px 200px; 11 background-repeat: no-repeat; 12 } 13 14 .blend { 15 background-image: linear-gradient(rgb(0,0,255), rgb(255,0,0)), 16 linear-gradient(rgb(0,0,255), rgb(255,0,0), rgb(0,0,255)); 17 background-blend-mode: difference; 18 } 19 20 </style> 21 <div class="reftest blend"></div> 22 </html>